輸入url後按回車，到頁面加載都發生了什麼？

前言

這是一個常見的前端筆試或面試題，雖然我還沒遇到過，可是也來一個全面總結。

1.DNS解析IP地址

DNS解析ip地址的過程是：首先檢查瀏覽器緩存中以及操做系統緩存中有沒有對應的已解析過的結果（hosts文件），若沒有則請求本地域名服務器（LDNS）來解析這個域名，若未成功解析，則跳轉到根域名服務器，根域名服務器給予一個主域名服務器地址，而後本地域名服務器再去請求主域名服務器地址，接着主域名服務器會返回網站註冊域名的服務器Name server的地址，本地服務器又去訪問Name server，最終找到ip地址並返回給本地域名服務器，而後緩存該ip地址，解析結束。

2.TCP三次握手創建鏈接

客戶端向服務端發送一個SYN報文，請求創建鏈接。
服務端收到報文確認後，發送一個SYN-ACK報文，表示確認收到請求。
客戶端收到服務器的報文後，返回一個ACK報文，鏈接創建。

3.發送http請求

客戶端向服務器發起一個HTTP-GET方法報文請求。請求中包含訪問的URL，KeepAlive，長鏈接，還有User-Agent用戶瀏覽器操做系統信息，編碼等。

4.部分服務器會進行重定向

在數據進入服務端以前，可能還會先通過負載均衡服務器，它會將請求合理分發到多臺服務器上，這是假設服務器端響應一個HTML文件。那麼客戶端瀏覽器就會判斷狀態碼是什麼，若是是200就會繼續解析，若是是400或500就會報錯，若是是300就會進行重定向。
例如，對於大型網站存在多個主機站點，爲了負載均衡或者導入流量，提升SEO排名，每每不會直接返回請求頁面，而是重定向。當瀏覽器知道了重定向後最終的訪問地址以後，會從新發送一個http請求，發送內容同上。

5.服務器處理，返回http響應

服務器接收到客戶端的獲取請求，而後處理並返回一個響應。

6.瀏覽器解析響應

瀏覽器解析來自服務器的報文響應，因爲在報頭中Content-type爲「text/html」，瀏覽器會以HTML形式呈現，而不是下載文件。若是是gzip格式的話，瀏覽器會先解壓一下，而後經過文件的編碼格式知道該如何去解碼文件。

7.構建DOM、CSSOM樹

瀏覽器會根據HTML構建DOM樹和CSSOM樹。若是遇到script標籤的話，會判斷是否存在async或者defer，前者會並行進行下載並執行js；後者會先下載文件；而後等待html解析完成後順序執行，若是以上都沒有，就會阻塞住渲染流程直至js文件執行完畢。

8.生成render樹並繪製

CSSOM樹和DOM樹構建完成後會開始生成render樹，這一步就是肯定頁面元素的佈局、樣式等等諸多方面的東西。同時在生成render樹的過程當中，瀏覽器就開始調用GPU繪製，合成圖層，將內容顯示在屏幕上了。