一.重绘是什么?
重绘: 当一个元素自身的宽高，布局，及显示或隐藏没有改变，而只是改变了元素的外观风格的时候，就产生了重绘。
二.回流是什么
回流： 当render tree的一部分或者全部元素因改变了自身的宽高，布局，显示或隐藏，或元素内部的文字结构发生变化，导致需要重新构建页面的时候，回流就产生了。
结论： 回流必定触发重绘，而重绘不一定触发回流。
如何避免回流：
1、不使用能够触发回流的属性；
2、建立一个图层，让回流在图层里面进行，限制回流和重绘的范围，减少浏览器的运算工作量。
三.如何划分图层
Css是怎么“划分图层”的：在页面加载完dom之后，浏览器会根据自身制定的一些特殊css 属性对页面进行划分为一个个图层。例如position: absolute|fixed 。
图层的优点： 当一个元素在自己的图层内发生变化时，他的回流和重绘只会在图层内发生变化，减少了浏览器的计算量。
扩展: 图层内部做了什么：
1、对图层里面的节点做回流和重布局运算，计算出他们的样式
2、生成图形和位置
3、将每个节点绘制填充在图层位图中
4、将涂层作为纹理发送到[GPU]上
5、将所有的图层合并，显示在浏览器的页面上
总结： 滥用图层会让页面进行了太多的合并运算而导致页面卡顿。所以图层的用途应该让那些经常要进行位置结构，布局变换的元素去使用。例如轮播图。
四.有哪些可替换的属性可以优化回流与重绘呢
1对于频繁变化的元素应该为其加一个 transform 属性 代替 top，left ，margin-top， margin-left... 这些位移属性
2：尽量使用 css属性简写,如:用border代替border-width,border-style,border-color3：不要使用 js 代码对dom 元素设置多条样式，选择用一个 className 代替之。
4：如果确实需要用 js 对 dom 设置多条样式那么可以将这个dom 先隐藏，然后再对其设置
5.:不要使用table 布局，因为table 的每一个行甚至每一个单元格的样式更新都会导致整个table 重新布局
