從輸入一個URL到頁面渲染的流程簡介

首先說明如下是我參考網上答案和本身的思考，給出本身的想法，若是有問題，歡迎你們吐槽
從用戶在瀏覽器中輸入一個URL，到整個頁面渲染，這個過程當中究竟發生了什麼呢？今天先簡單寫下整個過程，後面再一點點完善。

1、獲取IP地址

爲何要獲取IP地址？

IP地址對應一臺真實的物理機器，並且IP地址就像人的身份證是惟一的，用戶請求服務器，只須要輸入爲該服務器分配的惟一的IP地址便可。但因爲IP地址不便於記憶，於是使用較爲語義化的域名來替代IP地址，並且一個域名可能對應了對個IP地址，好比用戶輸入www.baidu.com,該域名下對應了多個IP，域名解析服務器會根據必定的規則分配給用戶其中一個IP地址。

1. 首先會在瀏覽器的緩存中查找，是否緩存了URL，若是有，就直接向該URL對應的服務器發送請求；若是沒有則進行下一步;
2. 在本地的hosts文件中是否保存了該URL和其對應的IP地址，若是保存了，就直接向該URL對應的服務器發送請求；若是沒有則進行下一步；
3. 向本地DNS服務器（通常由本地網絡接入服務器提供商提供，好比移動）發送DNS請求，本地DNS服務器會首先查詢它的緩存記錄，若是有就將該域名對應的IP地址返回給用戶，若是沒有則進行下一步；
4. 首先向根域名服務器發送DNS查詢請求，根域名服務器返回給可能保存了該域名的一級域名服務器地址；本地主機再根據返回的地址，向一級域名服務器發送DNS查詢請求；...一直迭代，直到找到對應的域名存放的服務器，向其發送DNS查詢請求，該域名服務器返回該域名對應的IP地址；

2、TCP/IP鏈接

三次握手：

爲何要進行三次握手？若是是兩次握手，以下面的對話只有前兩句，有可能出現的問題是：客戶端以前發送了一個鏈接請求報文，因爲網絡緣由滯留在網絡中，後來到達服務器端，服務器接收到該請求，就會創建鏈接，等待客戶端傳送數據。而此時客戶端壓根就不知道發生了什麼，白白形成了服務器資源浪費。

注：圖片來源於https://baijiahao.baidu.com/s...

1. 客戶端：我要請求數據能夠嗎？
2. 服務器：能夠的
3. 客戶端：好的

3、瀏覽器向web服務器發送http請求

客戶機與服務器創建鏈接後就能夠通訊了，這裏就暫時先不詳細展開說http請求了。講下客戶端請求靜態資源和動態資源。

1. 靜態資源：若是客戶端請求的是靜態資源，則web服務器根據URL地址到服務器的對應路徑下查找文件，而後給客戶端返回一個HTTP響應，包括狀態行、響應頭和響應正文。
2. 動態資源：若是客戶端請求的是動態資源，則web服務器會調用CGI/VM執行程序完成相應的操做，如查詢數據庫，而後返回查詢結果數據集，並將運行的結果--HTML文件返回給web服務器。Web服務器再將HTML文件返回給用戶。

4、瀏覽器渲染

瀏覽器拿到HTML文件後，根據渲染規則進行渲染：

1. 解析HTML，構建DOM樹
2. 解析CSS，生成CSS規則樹
3. 合併DOM樹和CSS規則樹，生成render樹
4. 佈局render樹
5. 繪製render數、樹，即繪製頁面像素信息
6. GPU將各層合成，結果呈如今瀏覽器窗口中。

5、四次揮手

客戶端沒有數據發送時就須要斷開鏈接，以釋放服務器資源。

注：圖片來源於https://baijiahao.baidu.com/s...

1. 客戶端：我沒有數據要發送了，打算斷開鏈接
2. 服務器：你的請求我收到了，我這還有數據沒有發送完成，你等下
3. 服務器：個人數據發送完畢，能夠斷開鏈接了
4. 客戶端：ok，你斷開鏈接吧（客戶端獨白：我將在2倍的最大報文段生存時間後關閉鏈接。若是我再次收到服務器的消息，我就知道服務器沒有收到個人這句話，我就再發送一遍）。

最終服務器收到該客戶端發送的消息斷開鏈接，客戶端也關閉鏈接。