網頁加載全過程

過程概述

• 瀏覽器查找域名對應的 IP 地址；

• 瀏覽器根據 IP 地址與服務器創建 socket 鏈接；

• 瀏覽器與服務器通訊： 瀏覽器請求，服務器處理請求；

• 瀏覽器與服務器斷開鏈接。

查找域名對應IP地址

訪問服務器須要先知道服務器的ip地址，因此第一步是經過 DNS 把域名解析成一個 IP 地址, DNS 具體的查找過程：（瀏覽器緩存->系統緩存->路由器緩存）

1. 瀏覽器搜索本身的 DNS 緩存（維護一張域名與 IP 地址的對應表）；
2. 搜索操做系統中的 DNS 緩存（維護一張域名與 IP 地址的對應表）；
3. 搜索操做系統的 hosts 文件（ Windows 環境下，維護一張域名與 IP 地址的對應表）；
4. 操做系統將域名發送至 LDNS（本地區域名服務器），LDNS 查詢 本身的 DNS 緩存（通常查找成功率在 80% 左右），查找成功則返回結果，失敗則發起一個迭代 DNS 解析請求：

創建鏈接（TCP的三次握手）

1. 主機向服務器發送一個創建鏈接的請求；

2. 服務器接到請求後發送贊成鏈接的信號；

3. 主機接到贊成鏈接的信號後，再次向服務器發送了確認信號 ;

⚠️注意：這裏的三次握手中主機兩次向服務器發送確認，第二次是爲了防止已失效的鏈接請求報文段傳至服務器致使錯誤。

網頁請求與構建

請求

1. 瀏覽器根據 URL 內容生成 HTTP 請求，請求中包含請求文件的位置、請求文件的方式等等；

2. 服務器接到請求後，會根據 HTTP 請求中的內容來決定如何獲取相應的 HTML 文件；

3. 服務器將獲得的 HTML 文件發送給瀏覽器；

4. 在瀏覽器尚未徹底接收 HTML 文件時便開始渲染、顯示網頁；

5. 在執行 HTML 中代碼時，根據須要，瀏覽器會繼續請求圖片、CSS、JavsScript等文件，過程同請求 HTML ；

頁面構建

1. HTML代碼轉化爲DOM(DOM Tree)

2. CSS代碼轉化成CSSOM（CSS Object Model）

3. 結合DOM和CSSOM，生成一棵渲染樹（包含每一個節點的視覺信息）(Render Tree)

4. 生成佈局（layout），即將全部渲染樹的全部節點進行平面合成

5. 佈局繪製（paint）在屏幕上

斷開鏈接(TCP的四次揮手)

1. 主機向服務器發送一個斷開鏈接的請求；

2. 服務器接到請求後發送確認收到請求的信號；(此時服務器可能還有數據要發送至主機)

3. 服務器向主機發送斷開通知；(此時服務器確認沒有要向主機發送的數據)

4. 主機接到斷開通知後斷開鏈接並反饋一個確認信號，服務器收到確認信號後斷開鏈接；