-
回流一定會(huì)觸發(fā)重繪
- 回流: DOM結(jié)構(gòu)的增刪改
- 重繪: 顏色,背景, 字體等視覺上頁面的改變
重繪不一定觸發(fā)回流
- 如何避免?
- Display: 會(huì)影響布局,從而影響整個(gè)頁面元素的位置變化, 所以會(huì)更改render樹的結(jié)構(gòu)
- 現(xiàn)將元素從document中刪除, 完成修改后再把元素放回原來的位置
- 如果需要?jiǎng)?chuàng)建多個(gè)DOM節(jié)點(diǎn), 可以使用documentFragment, 完成創(chuàng)建后一次性加入document
- 如何分辨重繪
- 改變字體
- 增加或者刪除樣式表
- 內(nèi)容變化, 比如input框中輸入文字
- 激活CSS偽類, 比如 :hover
- 腳本操作DOM (回流->重繪都會(huì)發(fā)生)
- 計(jì)算offsetWidth和offsetHeight屬性
- 設(shè)置style屬性的值回流
