重繪: 當頁面中元素樣式的改變並不影響它在文件流中的位置時，也就是說佈局沒有發生改變時(比如只是改變元素的顏色)。
迴流：當渲染樹(Render Tree)中的部分（或全部）元素的尺寸、結構、顯示隱藏等發生改變時，瀏覽器重新渲染的過程稱為迴流。 簡而言之，任何會改變元素幾何資訊（元素的位置和尺寸大小）的操作，都會觸發迴流。 迴流是影響瀏覽器效能的關鍵 因素。
比如：
（1）新增或者刪除可見的 DOM 元素(不可見元素不會觸發迴流)；
（2）元素尺寸或位置發生改變
（3）元素內容變化，比如文字數量或圖片大小
（4）瀏覽器視窗大小發生改變
（5）CSS偽類的啟用（例如：:hover，從而改變了元素的佈局的）
注意
迴流必定會發生重繪，重繪不一定會引發迴流。
迴流比重繪的代價要更高。有時即使僅僅迴流一個單一的元素，它的父元素以及任何跟它相關的元素也會產生迴流，牽一髮動全身。

如何避免(減少)迴流
css
避免設定多層內聯樣式。
如果需要設定動畫效果，最好將元素脫離正常的文件流。
避免使用CSS表示式（例如：calc()）。
JavaScript
避免頻繁操作樣式，最好將樣式列表定義為class並一次性更改class屬性。
避免頻繁操作DOM，建立一個documentFragment，在它上面應用所有DOM操作，最後再把它新增到文件中。
可以先為元素設定為不可見：display: none，操作結束後再把它顯示出來。
————————————————
版權宣告：本文為CSDN博主「windy-boy」的原創文章，遵循CC 4.0 BY-SA版權協議，轉載請附上原文出處連結及本宣告。
原文連結：https://blog.csdn.net/piaojiancong/article/details/115682174