建站
咨詢
售后
建站咨詢
新聞中心
回流和重繪是瀏覽器渲染頁面時的兩個重要概念，它們的區(qū)別如下：
讓客戶滿意是我們工作的目標，不斷超越客戶的期望值來自于我們對這個行業(yè)的熱愛。我們立志把好的技術(shù)通過有效、簡單的方式提供給客戶，將通過不懈努力成為客戶在信息化領(lǐng)域值得信任、有價值的長期合作伙伴，公司提供的服務(wù)項目有：域名與空間、虛擬空間、營銷軟件、網(wǎng)站建設(shè)、莊河網(wǎng)站維護、網(wǎng)站推廣。
定義
1、回流（Reflow）：當瀏覽器的渲染引擎發(fā)現(xiàn)某個部分發(fā)生了變化，需要重新計算該部分的幾何屬性以及其它相關(guān)屬性，這個過程就是回流，回流會導(dǎo)致整個頁面的布局發(fā)生變化，可能會影響頁面的性能。
2、重繪（Repaint）：當瀏覽器的渲染引擎發(fā)現(xiàn)某個部分的顏色、背景、邊框等樣式發(fā)生了變化，需要重新繪制該部分，這個過程就是重繪，重繪只會影響到頁面的部分區(qū)域，性能影響相對較小。
觸發(fā)條件
1、回流：
修改DOM元素的幾何屬性（如寬度、高度、邊距等）；
修改DOM元素的樣式（如顏色、背景、邊框等）；
添加或刪除DOM元素；
改變DOM樹的結(jié)構(gòu)（如增加或刪除子節(jié)點）。
2、重繪：
修改DOM元素的樣式（如顏色、背景、邊框等）；
修改CSS類名。
性能影響
1、回流：由于回流會導(dǎo)致整個頁面的布局發(fā)生變化，所以性能影響較大，在瀏覽器中，回流的成本是非常高的，因此應(yīng)該盡量減少回流的發(fā)生。
2、重繪：由于重繪只會影響到頁面的部分區(qū)域，所以性能影響較小，頻繁的重繪也會影響頁面的性能，因此應(yīng)該在不影響用戶體驗的前提下盡量減少重繪的發(fā)生。
優(yōu)化建議
1、避免頻繁操作DOM元素，盡量使用文檔片段（DocumentFragment）進行操作。
2、使用CSS3的transform和opacity屬性來替代left、top、margin等屬性，以減少回流的發(fā)生。
3、使用requestAnimationFrame()函數(shù)來進行動畫處理，以提高性能。
4、將多個改變樣式的操作合并為一個，以減少重繪的次數(shù)。
文章標題：回流和重繪有什么區(qū)別
標題來源：http://www.5511xx.com/article/cdghdej.html
