瀏覽器渲染的整個流程
瀏覽器的整個流程如上圖所示。
1、 首先當用戶輸入一個URL的時候，瀏覽器就會發送一個請求，請求URL對應的資源。
2、 然後瀏覽器的HTML解析器會將這個文件解析，並且構建成一棵DOM樹。
3、 在構建DOM樹的時候，遇到JS和CSS元素，HTML解析器就換將控制權轉讓給JS解析器或者是CSS解析器。
4、 JS解析器或者是CSS解析器解析完這個元素時候，HTML又繼續解析下個元素，直到整棵DOM樹構建完成。
5、 DOM樹構建完之後，瀏覽器把DOM樹中的一些不可視元素去掉，然後與CSSOM合成一棵render樹。
6、 接着瀏覽器根據這棵render樹，計算出各個節點(元素)在屏幕的位置。這個過程叫做layout，輸出的是一棵layout樹。
7、 最後瀏覽器根據這棵layout樹，將頁面渲染到屏幕上去。
資料：