版权声明：本文为博主原创文章，转载时请注明出处。 https://blog.csdn.net/i_dont_know_a/article/details/82774269
当我们在做前端开发的时候，肯定会碰到操作DOM的情况，在操作DOM的时候，就会引起浏览器的重绘与重排。
▍重绘
当DOM变化影响了元素的几何属性（宽、高改变等等），浏览器此时需要重新计算元素几何属性，并且页面中其他元素的几何属性可能会受影响，这样渲染树就发生了改变，也就是重新构造RenderTree渲染树，这个过程叫做重排（reflow）。
▍重排
如果DOM变化仅仅影响的了visibility、outline、背景色等等非几何属性，此时就发生了重绘（repaint）而不是重排，因为布局没有发生改变。
以下情况会引发重排：
- 页面初始渲染
- 添加/删除可见DOM元素
- 改变元素位置
- 改变元素尺寸（宽、高、内外边距、边框等）
- 改变元素内容（文本或图片等）
- 改变窗口尺寸
▍我是尾巴
重绘和重排都会影响性能（重排的影响更严重），所以，能避免的尽量避免。