重排(reflow)
当DOM的变化引发了元素几何属性的变化，比如改变元素的宽高，元素的位置，导致浏览器不得不重新计算元素的几何属性，并重新构建渲染树，这个过程称为“重排”或叫“回流”。
触发重排的条件：任何页面布局和几何属性的改变都会触发重排，如下：
- 页面渲染初始化；(无法避免)
- 添加或删除可见的DOM元素；
- 元素位置的改变，或者使用动画；
- 元素尺寸的改变——大小，外边距，边框；
- 浏览器窗口尺寸的变化（resize事件发生时）；
- 填充内容的改变，比如文本的改变或图片大小改变而引起的计算值宽度和高度的改变；
- 读取某些元素属性
- 为什么获取一些属性或调用方法也会导致回流？
因为以上属性和方法都需要返回最新的布局信息，因此浏览器不得不触发回流重绘来返回正确的值。
操作DOM其实是非常耗性能的，所以我们不仅要避免去操作DOM，还要减少访问DOM的次数。
重绘（repaint 或 redraw）
完成重排后，要将重新构建的渲染树渲染到屏幕上，这个过程就是“重绘”。
触发条件：比如元素的外观属性color,background-color等
简单的说:
重排负责元素的几何属性更新，重绘负责元素的样式更新。而且，重排必然带来重绘，但是重绘未必带来重排。比如，改变某个元素的背景，这个就不涉及元素的几何属性，所以只发生重绘。
转载请注明来源，欢迎对文章中的引用来源进行考证，欢迎指出任何有错误或不够清晰的表达。可以在下面评论区评论，也可以邮件至 chaoyumail@126.com
