回流与重绘

回流（reflow）与重绘（repaint）

回流（reflow)：当render tree中的一部分(或全部)，因为元素的规模尺寸、布局、隐藏等改变
而需要重新构建

1. 每个页面至少回流一次，即页面首次加载；
2. 回流时，浏览器会使渲染树中收到影响的部分失效，并重新构造这部分渲染树
3. 回流完成后，浏览器会重新绘制手影响的部分，是重绘过程

重绘（repeaint）当页面元素样式改变不影响元素在文档流中的位置时，浏览器只会将新的样式赋予元素并进行重新绘制操作
回流必将引起重绘，重绘不一定会引起回流

引发回流因素：
1、添加或删除可见元素，
2、元素位置改变
3、元素尺寸改变：边距、填充、边框、宽度和高度
4、页面渲染初始化
5、浏览器窗口尺寸改变：resize 事件发生时
6、获取元素的偏移量属性，例如：scrollTop、scrollLeft、scrollWidth、offsetTop、offsetLeft、offsetWidth、offsetHeight，浏览器为了保证值的正确性，会回流取最新的值
引发回流属性：
width
Height
Padding
Margin
Display
Border-width
Border
width
Height
Padding
Margin
Display
Border-width
Border
width
Height
Padding
Margin
Display
Border-width
Border