回流和重涂之间有什么区别？

Question

我对重排和重绘之间的区别还不清楚（如果有任何区别）

好像重排可能正在转移各种DOM元素的位置，其中重画只是呈现一个新对象。例如，在移除元素时将发生回流，而在更改其颜色时将发生重新绘制。

这是真的？

Answer 1

DOM布局发生更改时，就会发生重排。回流在计算上非常昂贵，因为必须再次计算页面元素的尺寸和位置，然后才能重新绘制屏幕。可能导致回流的示例for (let i = 1; i <= 100; i++ {const newEle = document.createElement('p');newEle.textContent = 'newly created paragraph element';document.body.appendChild(newEle);}上面的代码效率很低，每个附加的新段落元素都会导致100个重排过程。您可以使用以下方法缓解此计算压力大的过程 .createDocumentFragment()const docFrag = document.createDocumentFragment();&nbsp;for (let i = 1; i <= 100; i++ {&nbsp; &nbsp; const newEle = document.createElement('p');&nbsp; &nbsp; newEle.textContent = 'newly created paragraph element';&nbsp; &nbsp; docFrag.appendChild(newEle);&nbsp; &nbsp; }document.body.appendChild(docFrag);上面的代码现在将只使用重排过程1x来创建100个新的段落元素。重绘只是监视器上像素的变化，同时还要加重它的两个弊端，因为重排在其过程中包括重绘。