什么是Reflow
reflow(Gecko)或者 layout(webkit) 是浏览器计算页面的布局的过程。元素的reflow重新计算元素的尺寸和位置,还可能触发子元素、祖先元素、DOM中后面相邻元素的reflow,然后调用repaint。reflow很昂贵,但却可以很容易触发,触发太频繁会导致性能问题。
引起reflow的操作都有哪些
插入、修改或更新DOM中的元素。
修改网页中的内容,比如输入框中的文字。
移动DOM元素。
为DOM元素设置动画。
测量一个元素,如 offsetHeight 或 getComputedStyle。
更改CSS样式。
更改元素的className。
添加或删除样式表。
调整窗口大小。
滚动。
参考文档:
http://kellegous.com/j/2013/01/26/layout-performance/