一個頁面從輸入URL 到頁面加載顯示完成的過程當中都發生了什麼

前端面試/筆試必考問題，越詳細越好

先簡單得講：

瀏覽器根據請求的URL交給DNS域名解析，找到真實IP，向服務器發起請求；

    服務器交給後臺處理完成後返回數據，瀏覽器接收文件（HTML、JS、CSS、圖象等）；

    瀏覽器對加載到的資源（HTML、JS、CSS等）進行語法解析，創建相應的內部數據結構（如HTML的DOM）；

    載入解析到的資源文件，渲染頁面，完成。

 

詳細得說：

　 一、當發送一個URL請求時，無論這個URL是Web頁面的URL仍是Web頁面上每一個資源的URL，瀏覽器會開啓一個線程來處理這個請求，對URL 分析判斷若是是 http 協議就按照 Web 方式來處理;

    二、調用瀏覽器內核中的對應方法，好比 WebView 中的 loadUrl 方法;

    三、在遠程DNS服務器上啓動一個DNS查詢，這能使瀏覽器得到請求對應的IP地址。經過DNS解析獲取網址的IP地址，設置 UA 等信息發出第二個GET請求;

    四、進行HTTP協議會話，客戶端發送報頭(請求報頭)：瀏覽器與遠程Web服務器經過TCP三次握手協商來創建一個TCP/IP鏈接。該握手包括一個同步報文，一個同步-應答報文和一個應答報文，這三個報文在 瀏覽器和服務器之間傳遞。該握手首先由客戶端嘗試創建起通訊，然後服務器應答並接受客戶端的請求，最後由客戶端發出該請求已經被接受的報文。

    五、進入到web服務器上的 WebServer，如 Apache、Tomcat、Node.JS 等服務器;

    六、進入部署好的後端應用，如PHP、Java、JavaScript、Python 等，找到對應的請求處理;

    七、處理結束回饋報頭，此處若是瀏覽器訪問過，緩存上有對應資源，會與服務器最後修改時間對比，一致則返回304;

    八、瀏覽器開始下載html文檔(響應報頭，狀態碼200)，同時使用緩存;

    九、文檔樹創建，根據標記請求所需指定MIME類型的文件（好比css、js）,同時設置了cookie;

   十、瀏覽器會解析HTML生成DOM Tree，其次會根據CSS生成CSSRule Tree，而javascript又能夠根據DOMAPI操做DOM，執行事件綁定等，頁面顯示完成。