什么是重绘和回流，如何减少？
1. 浏览器渲染过程
1.解析HTML，构件DOM树
2.解析CSS，生成样式规则
3.合并DOM树和样式规则，生成DOM树(rander树)
4.布局render树 (layout、reflow),负责各元素的尺寸、位置等的计算
5.绘制render树(painting)，绘制页面像素信息
6.浏览器将会将各层的信息发送给GPU,GPU会将各层合成,最后显示在屏幕上
2 基本概念
2-1 重绘
重绘:当页面元素样式改变不影响元素在文档流中的位置时,如background-color,border-color,visibility等,浏览器只会将新的样式赋予元素并进行重新绘制操作
2-2 回流
当渲染树(render tree)中的一部分或全部因为元素的尺寸、布局、隐藏等改变时、浏览器重新渲染部分DOM或者全部DOM的过程
2-3 注：回流必将引起重绘，而重绘不一定会引起回流
3 如何减少
3-1 CSS中避免重绘和回流
1、尽可能的在DOM树的最末端改变class
2、避免设置多层内联样式
3、动画效果应用到position属性为absolute或者fixed的元素上
4、避免使用table布局
5、使用css3硬件加速，可以让transform、opacity、filters邓东华不会引起重绘
3-2 js操作避免回流和重绘
1、避免使用js一个样式修改完接着下一个样式、最好一次性更改css样式、或者将样式定义好class
2、避免频繁操作DOM，使用文档片段创建子树，然后再拷贝到文档中
3、先隐藏元素、进行修改后在显示该元素、因为display:none;上的DOM操作不会引起回流和重绘
4、避免循环读取offsetleft等属性，再循环之前把他们保存起来
5、对于复杂动画效果、使用绝对定位让其脱离文档流、否则会引起父元素及后续元素大量回流
