什么是重绘、重排
重绘不一定导致重排,但重排一定会导致重绘
- 某些元素的外观改变所触发浏览器行为,例如:修改元素的填充颜色,会触发重绘
- 重新生成布局,重新排列元素,例如:改元素的宽高,会触发重排
重绘
改变color
样式集中改变可以减少重排次数
将 DOM 离线
当对DOM 节点有较大改动的时候,我们先将元素脱离文档流,然后对元素进行操作,最后再把操作后的元素放回文档流。修改DOM节点的display属性,临时将此节点从文档流中脱离,然后再恢复;
脱离文档流: 使用 absolute 或 fixed 脱离文档流(减小重排范围)
善用内存:在内存中多次操作DOM,再整个添加到DOM树(减小重排范围)
异步请求接口获取数据,动态渲染到页面