從輸入域名到最後呈現經歷的過程

具體步驟

1.瀏覽器的地址欄輸入URL並按下回車。
2.瀏覽器查找當前URL是否存在緩存，並比較緩存是否過時。
3.DNS解析URL對應的IP。
4.根據IP創建TCP鏈接（三次握手）。
5.HTTP發起請求。
6.服務器處理請求，瀏覽器接收HTTP響應。
7.渲染頁面，構建DOM樹。
8.關閉TCP鏈接（四次揮手）。

詳細描述

1.HTTP緩存有多種規則，根據是否須要從新向服務器發起請求分爲兩種：強制緩存，對比緩存.

強制緩存：
    cache-control：中的max-age保存一個相對時間。表示瀏覽器接收到文件以後，緩存在相對應的時間內均有效。若是同時存在cache-control和Expires,瀏覽器優先使用cache-control
    Expires：是一個絕對時間，即服務器時間。瀏覽器檢查當前時間，若是尚未失效就直接用緩存文件。該方法有一個問題，服務器可能和客戶端時間不一致，所以該字段不多使用。 
對比緩存：
    last-modified是第一次請求資源時，服務器返回的字段，表示最後一次更新時間。下次瀏覽器請求資源時就發送if-modified-since字段。服務器用本地last-modified時間與if-modified-since時間比較，若是不一致則認爲緩存已過時並返回新的資源給瀏覽器，若是時間一致則返回304狀態碼，讓瀏覽器繼續使用緩存。
    Etag：資源的實體標識（哈希字符串），當資源內容更新時，Etag會改變。服務器會判斷Etag是否變化，若是變化返回新資源，不然返回304。
複製代碼

2.域名解析

在地址欄輸入域名並非最後資源所在的真實位置，域名只是一個IP地址的一個映射。

1.首先瀏覽器會先查找本地hosts文件是否有這個網址映射關係，若是有就調用這個IP地址映射，完成域名解析。
2.若是沒有找到則會查找本地的DNS解析器緩存，若是找到則返回。
3.若是仍是沒有找到則會查找本地DNS服務器，若是找到則返回。
4.最後迭代查詢，按根域服務器->頂級域名.cn->第二層域名->子域名的順序找到IP地址
複製代碼

3.發起TCP的3次握手

在解析域名以後，獲取了服務器的IP地址，開始創建鏈接，這是由TCP協議完成的，主要經過三次握手進行鏈接。

第一次握手：創建鏈接時，客戶端發送syn包(syn=j)到服務器，並進入SYN_SENT狀態，等待服務器確認；
第二層握手：服務器接收到syn包，必須確認客戶端的SYN(ack=j+1)，同時本身也發送一個SYN包(syn=k)，即SYN+ACK包，此時服務器進入SYN_RECV狀態；
第三次握手：客戶端收到服務器的SYN_ACK包，向服務器發送確認包ACK(ack=k+1)，此包發送完畢，客戶端和服務器進入ESTABLISHED(TCP鏈接成功)狀態，完成三次握手。
複製代碼

4.創建TCP鏈接後發起http請求

完整的HTTP請求包含請求行，請求頭部，請求主體三個部分。(具體就不一一講述了)
複製代碼

5.服務器響應http請求，瀏覽器接收響應

服務器在收到瀏覽器發送的HTTP請求以後，會收到HTTP報文封裝成HTTP的Request對象，並經過不一樣的web服務器進行處理，處理完的結果以HTTP的Response對象返回，主要包括狀態碼，響應頭，響應報文三個部分。
狀態碼主要包括如下部分：
    1xx：指示信息-表示請求已接收，繼續處理
    2xx：成功-表示請求已被成功接收，理解，接收
    3xx：重定向-要完成請求必須進行更進一步的操做
    4xx：客戶端錯誤-請求語法錯誤或請求沒法實現
    5xx：服務器端錯誤：服務器未能合法實現請求
響應頭主要由：cache-control、connection、date、pragma等組成。
複製代碼

6.瀏覽器解析html，頁面渲染

在瀏覽器還沒接收到完整的HTML文件時，它就開始渲染頁面了，在遇到外部鏈入的腳本或圖片時，會再次發生HTTP請求重複上述步驟。在收到css文件後對已經渲染的頁面從新渲染，加入它們對應的樣式，圖片文件加載完馬上顯示在相應的位置。在這一過程當中可能會觸發重繪或重排。

reflow：也稱做layout，中文叫回流，通常意味着元素的內容、結構、位置或尺寸發生了變化，須要從新計算樣式和渲染樹，這個過程稱爲reflow。
    repaint：中文重繪，意味着元素髮生的改變只是影響了元素的一些外觀之類的時候(例如：背景色，邊框顏色，文字顏色等)，此時只須要應用新樣式繪製這個元素就能夠了。
複製代碼

7.四次揮手結束，關閉TCP鏈接

經過四次揮手關閉鏈接(FIN ACK、ACK、FIN ACK、ACK)。

第一次揮手：瀏覽器發完數據後，發生FIN請求斷開鏈接
    第二次揮手：服務器發送ACK表示贊成斷開鏈接
    第三次揮手：服務器發送FIN請求斷開鏈接
    第四次揮手：瀏覽器須要返回ACK表示贊成斷開
複製代碼