我对回流+重涂之间的区别还不清楚（如果有什么区别）
好像重排可能正在转移各种DOM元素的位置，其中重画只是呈现一个新对象。例如，在移除元素时将发生回流，而在更改其颜色时将发生重新绘制。
这是真的？
回流和重涂之间有什么区别？
Answers:
该帖子似乎涵盖了回流焊与重涂性能问题
至于定义，从那篇文章：
一个重绘更改时的元素皮肤改变明显制成，但不影响其布局发生。
这方面的例子包括
outline，visibility，background，或color。根据Opera的说法，重绘是昂贵的，因为浏览器必须验证DOM树中所有其他节点的可见性。一个回流更是关键的性能，因为它涉及影响页面（或整个页面）的部分的布局变化。
例子是回流的原因包括：添加或移除的内容，或明或暗地改变
width，height，font-family，font-size等等。
在http://csstriggers.com上了解哪些CSS属性会重绘和查看
这是另一篇很棒的文章：http : //blog.letitialew.com/post/30425074101/repaints-and-reflows-manipulating-the-dom
重新绘制或重新绘制所有元素，并确定它们的可见性，颜色，轮廓和其他视觉样式属性，然后更新屏幕的相关部分。
重排计算页面的布局。元素上的重排会重新计算元素的尺寸和位置，并且还会触发该元素的子元素，祖先元素和出现在DOM中的元素的进一步重排。然后调用最后的重涂。回流非常昂贵。
还介绍了何时发生回流以及如何最大程度地减少回流。
在我看来，重绘只会影响DOM本身，但重排会影响整个页面。
当仅更改其皮肤样式（例如颜色和可见性）的某些更改时，就会发生重画。
当DOM页面更改其布局时会发生重排。
最近，我发现一个站点可以搜索哪个属性将触发重画或重排。 http://csstriggers.com/
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();
for (let i = 1; i <= 100; i++ {
const newEle = document.createElement('p');
newEle.textContent = 'newly created paragraph element';
docFrag.appendChild(newEle);
}
document.body.appendChild(docFrag);
上面的代码现在将仅使用重排过程1x来创建100个新的段落元素。
重绘只是监视器上像素的变化，同时还要加重它的两个弊端，因为重排在其过程中包括重绘。
