>[success] # 回流和重绘 1. **回流reflow**也可以称之为**重排**,**第一次**确定节点的大小和位置，称之为**布局（layout）**,之后对**节点的大小、位置修改重新计算**称之为**回流**例如： 1.1. 比如DOM结构发生改变（添加新的节点或者移除节点） 1.2. 比如改变了布局（修改了width、height、padding、font-size等值） 1.3. 比如窗口resize（修改了窗口的尺寸等） 2. **重绘repaint**，第一次渲染内容称之为**绘制（paint）**，之后重新渲染称之为**重绘**例如 2.1. 修改背景色、文字颜色、边框颜色、样式等 注： **回流一定会引起重绘**，所以回流是一件很消耗性能的事情。 >[danger] ##### 避免回流 1. 修改样式时尽量一次性修改，比如通过cssText修改，比如通过添加class修改 2. 尽量避免频繁的操作DOM，可以在一个DocumentFragment或者父元素中将要操作的DOM操作完成，再一次性的操作 3. 对某些元素使用position的absolute或者fixed，这样虽然也会回流但是开销相对较小，不会对其他元素造成影响。