獲取到html文件
第一步當用戶在url中輸入網址時
1. 瀏覽器會檢查緩存中有沒有這個域名對應的解析過的IP地址，如果緩存中有，這個解析過程就結束。
2. 如果在本地沒有找到對應的ip地址，就到本地域名服務器中去找。
3. 如果本地域名服務器沒找到就向根域名服務器發起請求去找。
第二步：找到IP地址后瀏覽器和服務器建立連接(屬於傳輸層，涉及TCP，UDP協議，TCP的三次握手和松手過程，TCP支持的應用協議主要有：Telnet、FTP、SMTP等；UDP支持的應用層協議主要有：NFS（網絡文件系統）、SNMP（簡單網絡管理協議）、DNS（主域名稱系統）、TFTP（通用文件傳輸協議）等。)
第三步： 瀏覽器發起HTTP(屬於五層網絡模型中的應用層，涉及HTTP協議，TODO: 《圖解HTTP》)請求（屬於五層模型中的應用層），服務器發送回HTTP報文。
接下來就會釋放TCP鏈接。
構建DOM樹
由於瀏覽器采用自上而下的方式解析，在遇到這兩種元素時都會阻塞瀏覽器的解析，直到外部資源加載並解析或執行完畢后才會繼續向下解析html。對於樣式與腳本的先后順序同樣也會影響到瀏覽器的解析過程，究其原因主要在於：script腳本執行過程中可能會修改html界面（如document.write函數）；DOM節點的CSS樣式會影響js的執行結果。
DOM樹創建完成后DOMContentLoaded事件即觸發，這時候可以用過script來操作DOM節點。
渲染阻塞
當瀏覽器遇到一個 script 標記時，DOM 構建將暫停，直至腳本完成執行，然后繼續構建DOM。每次去執行JavaScript腳本都會嚴重地阻塞DOM樹的構建，如果JavaScript腳本還操作了CSSOM，而正好這個CSSOM還沒有下載和構建，瀏覽器甚至會延遲腳本執行和構建DOM，直至完成其CSSOM的下載和構建。
所以，script 標簽的位置很重要。實際使用時，可以遵循下面兩個原則：
CSS 優先：引入順序上，CSS 資源先於 JavaScript 資源。JS置后：我們通常把JS代碼放到頁面底部，且JavaScript 應盡量少影響 DOM 的構建。
當解析html的時候，會把新來的元素插入dom樹里面，同時去查找css，然后把對應的樣式規則應用到元素上，查找樣式表是按照從右到左的順序去匹配的。
例如： div p {font-size: 16px}，會先尋找所有p標簽並判斷它的父標簽是否為div之后才會決定要不要采用這個樣式進行渲染）。所以，我們平時寫CSS時，盡量用id和class，千萬不要過渡層疊。
構建呈現樹
HTML解析完畢后，開始構建呈現樹RenderTree，這一步的主要工作在於將css樣式應用到DOM節點上，WebKit內核將這一過程稱為附着，其他瀏覽器有不同的概念。對前端工程師而言這個過程會涉及到CSS層疊問題。
呈現樹的每一個節點即為與其相對應的DOM節點的CSS框，框的類型與DOM節點的display屬性有關，block元素生成block框，inline元素生成inline框。每一個呈現樹節點都有與之相對應的DOM節點，但DOM節點不一定有與之相對應的呈現樹節點，比如display屬性為none的DOM節點，而且呈現樹節點在呈現樹中的位置與他們在DOM樹中的位置不一定相同，比如float與絕對定位元素。
布局
呈現樹之后進入“布局”處理階段，也就是為每個節點分配一個應出現在屏幕上的確切坐標。
為達到更好的用戶體驗，呈現引擎會力求盡快將內容顯示在屏幕上。它不必等到整個 HTML 文檔解析完畢之后，就會開始構建呈現樹和設置布局。在不斷接收和處理來自網絡的其余內容的同時，呈現引擎會將部分內容解析並顯示出來。
繪制
在繪制階段，系統會遍歷呈現樹，並調用呈現器的“paint”方法，將呈現器的內容顯示在屏幕上。繪制工作是使用用戶界面基礎組件完成的。