我在SO和其他地方读到，重新绘制和重新流对于浏览器来说是昂贵的。
我对重新绘制/display:none和重新流动/visibility:hidden的CSS/JS替代方案感到好奇，这些替代方案对浏览器的计算要求不高。
只是为了清楚，请纠正我，如果我错了，一个常见的回流场景是当你设置display:none上的元素，你想切换的显示，例如，下拉菜单。重流意味着浏览器首先"流"，即显示元素和下面的所有内容为可见内容，但随后必须重新流所有内容，因为下拉菜单需要隐藏。
对于回流和重绘对性能的影响是否真的是人们需要关心的问题，我们也欢迎评论。
我想你误解了那句话。
如果要动态生成元素，请考虑以下两种场景:
- 生成一个元素，添加到DOM中。重复。 首先创建一个DOMDocumentFragment。将元素添加到片段中。重复。将该片段添加到DOM中。
方法1将为您添加的每个元素重新绘制。方法2将只在最后重新绘制一次。如果要添加的元素数量较少，则方法1可能比较好。如果您要添加许多节点，方法2将会快得多。
这就是重新粉刷是昂贵的的意思。
也许这是一个很好的看待它的方式:
重新粉刷的基础成本是100。创建一个DOM元素并追加它的成本为1。如果你对7个元素执行方法1，你的成本将是(1 + 100)* 7 = 707。如果你使用方法2，你的成本将是:1 * 7 + 100 = 107。这是相当低的。这些数字只是为了说明。可能还有比这更多的东西，但我认为这是一个很好的和简单的方式来看待重新绘制性能。
没有简单的公式。首先，每个浏览器都有自己的方式来处理回流和重绘。通常，浏览器会尽量推迟回流，因为您知道，回流的代价非常大。
一般来说，请记住以下操作总是触发回流:
- 通过添加、移除或移动节点来改变DOM树。
- 改变CSS计算属性，如
offsetWidth - 读取
getComputedStyle(或旧IE上的currentStyle)的计算CSS值
(参见DOM环境中什么时候会发生回流?)
设置样式通常会导致回流，但如果更改不会影响其他元素的位置或尺寸，浏览器会尽量避免它[来源请求]。
有关回流的一些乐趣，请参阅它会回流吗?