重绘repaint和回流reflow
重绘repaint
屏幕的一部分要重画，不影响整体布局，比如某个CSS的背景色变了。但是元素的几何尺寸没有变。
回流reflow
元素的几何尺寸变了，需要重新验证并计算Render Tree。
如何触发reflow和repaint
repaint的触发：
1）不涉及任何dom元素的排版问题的变动为repaint，例如元素的color、text-align等改变。
2）color的修改，text-align的修改，a：hover也会造成重绘，伪类引起的颜色等变化不会导致页面的回流，仅仅会触发重绘。
reflow的触发：
1）width、height、border、margin、padding的修改
2）通过hover造成元素表现的改动，如display:none会导致回流
注意 visibility:hidden 占有空间，display:none 不占空间
3）appendChild等dom元素操作。
4）font类style 的修改。
注意：回流必将引起重绘，而重绘不一定会引起回流。（ 回流之后会重绘。）
如何减少重绘及回流？
1.不要一条一条的修改DOM的样式。
2.把DOM离线后修改
-
使用DocumentFragment对象在内存里操作DOM
-
先把DOM给display：none
-
clone到一个DOM节点到内存里
3.为动画的HTML元素使用fixed或absolute的position
减少回流
1.使用visibility:hidden代替display:none;
2.使用translate代替top定位.