菜菜菜鳥日記—Reflow()回流與Repaint()重繪
一.什么是Reflow(),Repaint()
- Reflow()
指瀏覽器為了重新渲染部分或者全部的檔案而重新計算檔案中元素的位置和幾何構造的程序,每個頁面至少需要一次回流,在頁面第一次加載的時候,根據HTML渲染程序,回流一定會引起重繪,而重繪不一定會引起回流,因此回流的開銷較大,會影響頁面性能, - Repaint()
如果只是改變某個元素的background-color、color、outline等只是影響元素的外觀樣式,不會影響它周圍或內部布局,將只會引起瀏覽器 repaint(重繪),repaint 的速度明顯快于 reflow,
二.如何提高頁面性能
因為Reflow()回流造成的開銷較大,要提高頁面性能,避免reflow的開銷成為頁面優化的重要途經,首先要了解哪些頁面操作會引起頁面回流,
三.引起Reflow()回流的操作
- 對DOM節點進行增刪移動,
- 改變視窗或頁面文字大小時,
- 激活偽類時,如:hover,
…
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/163547.html
標籤:其他
