- 元素在视口的大小或者位置发生变化；
- 元素的新增或者删除（以及基于display的显示和隐藏）
- 浏览器视口大小发生改变；
这些操作都会重新计算每一个元素在视口中位置和大小（也就是重新Layout/Reflow）
当代浏览器的渲染队列
当代浏览器的渲染队列机制：在当前上下文操作中，遇到一行修改样式的代码，并没有立即通知浏览器渲染。而是把它放置在渲染队列中，接下来看是否还有修改样式的代码，如果有继续放置在渲染队列中，一直到再也没有修改样式的代码或者“遇到一次获取样式的操作”，这样都会刷新浏览器的渲染队列机制（也就是把现在队列中修改样式的操作，统一告诉浏览器模块，这样只会引发一次回流）
减少DOM的回流操作：
1、样式的“分离读写“， 把修改样式和获取样式分离开；
box.offsetHeight/box.style.xxx/window.getComputedStyle(box).xxx..... 这些获取样式都会刷新渲染队列
2、文档碎片：临时存放元素对象的容器； document.createDocumentFragment();
3、把动画等频发样式改变的操纵，运用到postion: fixed/absolute..上，【脱离文档流：单独一层】
+利用分层机制，如果只改变一个层面上的位置大小等信息，浏览器回流和重绘的速度会加快很多；
4、修改元素的transform / opacity(filters)...这些样式，不会引发DOM的回流【浏览器的硬件加速，弊端就是消耗浏览器的内存】
