回流和重绘的区别

1、回流与重绘的定义

当render tree中的一部分(或全部)因为元素的规模尺寸，布局，隐藏等改变而需要重新构建。这就称为回流(reflow)。每个页面至少需要一次回流，就是在页面第一次加载的时候。在回流的时候，浏览器会使渲染树中受到影响的部分失效，并重新构造这部分渲染树，完成回流后，浏览器会重新绘制受影响的部分到屏幕中，该过程成为重绘。

2、如何减少回流、重绘

减少回流、重绘其实就是需要减少对render tree的操作（合并多次多DOM和样式的修改），并减少对一些style信息的请求，尽量利用好浏览器的优化策略。具体方法有：
1.直接改变className

2.使用DocumentFragment进行缓存操作,引发一次回流和重绘；

3.使用display:none技术，只引发两次回流和重绘; ( 只是减少重绘和回流的次数，display：none 是会引起重绘并回流，相对来说，visibility: hidden只会引起重绘 )

4.不要经常访问会引起浏览器flush队列的属性，如果你确实要访问，利用缓存

5.让元素脱离动画流，减少回流的Render Tree的规模