在構建渲染樹的過程中，瀏覽器主要完成了一下工作：
前邊通過構造渲染樹，我們將可見dom節點以及它對應的樣式結合起來，可是我們還需要計算他們在裝置視口（viewport）內的準確位置和大小，這個計算的階段就是回流。
最終，我們通過構造渲染樹和回流階段，我們知道了哪些節點是可見的，以及可見節點的樣式和具體的幾何資訊（位置，大小）。那麼我們就可以將渲染樹的每個節點都轉換為螢幕上的實際畫素，這個階段就叫做重繪節點。
通過前邊的介紹，回流這一階段主要是計算節點的位置和幾何資訊，那麼當頁面布局和幾何資訊發生變化的時候，就需要回流：
參考位址
頁面的重繪與回流
上次在面試中，面試官問了我乙個關於頁面重繪和回流的問題，我解釋的不怎麼好。今天把它整理了一下，又參考了一些其他的文章。參考文章 頁面載入過程 1 瀏覽器將獲取到的html 解析成乙個dom樹，html中的每乙個標籤都是dom樹中的乙個節點，根節點就是document。dom樹中包含了所有的html標...
頁面的重繪與回流及優化
首先要清楚頁面呈現的具體過程 1.瀏覽器把獲取到的html 解析成1個dom樹，html中的每個tag都是dom樹中的1個節點，根節點就是我們常用的document物件。dom樹里包含了所有html標籤，包括display none隱藏，還有用js動態新增的元素等。2.瀏覽器把所有樣式 使用者定義的...
web頁面的回流和重繪
什麼是回流？回流也叫重排 reflow 當頁面中的元素發生影響布局的變化，比如 改變寬高，修改顯示影藏。頁面需要重新布局，就會觸發重排。簡單的說就是，頁面布局改變，就會觸發重排。什麼是重繪 repaint 頁面中的元素樣式發生改變注意 每個頁面只要會發生一次重排和重繪。重排一定會觸發重繪前端效能優化...