一個瀏覽器有很多個模塊，其中負責呈現頁面的是渲染引擎模塊，呈現頁面的過程是這樣的：
1、解析HTML，並生成一顆DOM tree；
2、解析各種樣式並結合DOM tree生成一顆Render tree；
3、對Render tree的各個節點計算佈局信息，比如box的位置與尺寸；
4、根據Render tree 並利用瀏覽器的UI層進行繪製；
什麼情況下瀏覽器會進行layout？如下操作會打破常規，並觸發瀏覽器執行layout：
1、通過js獲取需要計算的DOM屬性；
2、添加或刪除DOM元素；
3、resize瀏覽器窗口大小；
4、改變字體；
5、css僞類的激活，比如:hover;
6、通過js修改DOM元素樣式並且該樣式涉及到尺寸的改變；