文章目錄

• 1.DNS域名解析
• 2.建立TCP連線
• 3.傳送HTTP請求
• 4.接受響應結果
• 5.瀏覽器解析html
• 6.瀏覽器佈局渲染

1.DNS域名解析

• 在瀏覽器DNS快取中搜索
• 在作業系統DNS快取中搜索
• 讀取系統hosts檔案，查詢其中是否有對應的ip
• 向本地配置的首選DNS伺服器發起域名解析請求

2.建立TCP連線

為了準確地傳輸資料，TCP協議採用了三次握手策略。傳送端首先發送一個SYN（synchronize）標誌的資料包給接收方，接收方收到後，回傳一個帶有SYN/ACK(acknowledegment)標誌的資料包以示傳達確認資訊。最後傳送方再回傳一個帶ACK標誌的資料包，代表握手結束。在這過程中若出現問題中斷，TCP會再次傳送相同的資料包。

TCP是一個端到端的可靠的面向連線的協議，所以HTTP基於傳輸層TCP協議不用擔心資料的傳輸的各種問題。

3.傳送HTTP請求

請求方法：

• GET：獲取資源
• POST：傳輸實體主題
• HEAD：獲取報文首部
• PUT：傳輸檔案
• DELETE：刪除檔案
• OPTIONS：詢問支援的方法
• TRACE：追蹤路徑

4.接受響應結果

伺服器返回的狀態碼：

• 1**：資訊性狀態碼
• 2**：成功狀態碼
  200：OK 請求正常處理
  204：No Content請求處理成功，但沒有資源可返回
  206：Partial Content對資源的某一部分的請求
• 3**：重定向狀態碼
  301：Moved Permanently 永久重定向
  302：Found 臨時性重定向
  304：Not Modified 快取中讀取
• 4**：客戶端錯誤狀態碼
  400：Bad Request 請求報文中存在語法錯誤
  401：Unauthorized需要有通過Http認證的認證資訊
  403：Forbidden訪問被拒絕
  404：Not Found無法找到請求資源
• 5**：伺服器錯誤狀態碼
  500：Internal Server Error 伺服器端在執行時發生錯誤
  503：Service Unavailable 伺服器處於超負載或者正在進行停機維護

5.瀏覽器解析html

瀏覽器按順序解析html檔案，構建DOM樹，在解析到外部的css和js檔案時，向伺服器發起請求下載資源，若是下載css檔案，則解析器會在下載的同時繼續解析後面的html來構建DOM樹，則在下載js檔案和執行它時，解析器會停止對html的解析。這便出現了js阻塞問題。

瀏覽器解析css，形成CSSOM樹，當DOM樹構建完成後，瀏覽器引擎通過DOM樹和CSSOM樹構造出渲染樹。渲染樹中包含可視節點的樣式資訊（不可見節點將不會被新增到渲染樹中，如：head元素和display值為none的元素）

這個過程是逐步完成的，為了更好的使用者體驗，渲染引擎將會盡可能早的將內容呈現到螢幕上，並不會等到所有的html都解析完成之後再去構建和佈局render樹。它是解析完一部分內容就顯示一部分內容，同時，可能還在通過網路下載其餘內容。

6.瀏覽器佈局渲染

• 佈局：通過計算得到每個渲染物件在可視區域中的具體位置資訊（大小和位置），這是一個遞迴的過程。
• 繪製：將計算好的每個畫素點資訊繪製在螢幕上