什么是重绘和回流？
重绘: 当页面中元素样式的改变并不影响它在文档流中的位置时，也就是说布局没有发生改变时(比如只是改变元素的颜色)。
回流： 当渲染树(Render Tree)中的部分（或全部）元素的尺寸、结构、显示隐藏等发生改变时，浏览器重新渲染的过程称为回流。
注意：
回流必定会发生重绘，重绘不一定会引发回流。
回流比重绘的代价要更高。有时即使仅仅回流一个单一的元素，它的父元素以及任何跟它相关的元素也会产生回流，牵一发动全身。
引起回流的因素？
（1）添加或者删除可见的 DOM 元素(不可见元素不会触发回流)；
（2）元素尺寸或位置发生改变
（3）元素内容变化，比如文字数量或图片大小
（4）浏览器窗口大小发生改变
（5）CSS伪类的激活（例如：:hover，从而改变了元素的布局的）
如何减少重绘和回流？
CSS
使用transform代替top； 使用visibility代替display：none，前者引起重绘，后者引发回流；
避免使用table布局； 尽可能在DOM树最末端改变class； 避免设置多层内联样式，css选择符从右往左匹配查找，避免节点层级过多；
将动画效果应用到position属性为absolute或fixed的元素上，避免影响其他元素的布局； 避免使用css表达式，可能会引发回流；
css硬件加速；
JavaScript
避免频繁操作样式，修改class最好； 避免频繁操作DOM，合并多次修改为一次； 避免频繁读取会引发回流/重绘的属性，将结果缓存；
对具有复杂动画的元素使用绝对定位，使他脱离文档流。
