我试图弄清楚创建元素时何时触发回流或重绘。
此上下文试图了解如果直到函数结束之前元素都没有附加到 DOM 树中的现有项目，则是否需要 DocumentFragment。这是一个例子：
<body>
<div id=target> </div>
</body>
const ul = document.CreateElement("ul")
for (let i=0; i<100000; i++) {
let li = document.CreateElement("li")
let li_text = document.CreateTextNode("Node #: " + i)
li.appendChild(li_text)
ul.appendChild(li)
}
document.getElementById("target").appendChild(ul)
在此示例中，每次在循环中创建
如果是前者，防止这种多重回流的适当方法是：(1) 创建一个文档片段，(2) 将
如果是后者...那么在这样的上下文中使用文档片段有什么好处？
我正在开发一个涉及动态创建许多列表的项目——我正在研究性能优化，并且不确定如何监视或测试这种行为。通常我在 Firefox 上进行测试，并从本地目录托管 apache。
在将元素追加到 DOM 之前，createElement() 是否会触发回流？
不。如果该元素不在 DOM 中，则无需计算（重新）流。 （重新）流与正在显示的页面中的元素相关。
如果是后者...那么在这样的上下文中使用文档片段有什么好处？
在您只添加一个顶级元素的特定情况下，片段没有帮助。但是，如果您想在顶层构建一个包含多个元素的结构，那么使用片段可以让您做到这一点，然后将它们一次性全部附加到活动 DOM，而不是一次一个。
在将元素追加到 DOM 之前，createElement() 是否会触发回流？
不。如果该元素不在 DOM 中，则无需计算（重新）流。 （重新）流与正在显示的页面中的元素相关。
如果是后者...那么在这样的上下文中使用文档片段有什么好处？
在您只添加一个顶级元素的特定情况下，片段没有帮助。但是，如果您想在顶层构建一个包含多个元素的结构，那么使用片段可以让您做到这一点，然后将它们一次性全部附加到活动 DOM，而不是一次一个。