Chrome中的并发DOM节点修改？

Question

我正在尝试以递归方式将 CSSStyleDeclaration 对象重新应用到文档的 innerHTML 中的每个节点。例如，如果您在此页面上调用 window.getComputedStyle(document.getElementsByTagName("a")[0])，则返回的散列中有大约 650 个不同的属性。假设我的文档的 innerHTML 中有 1000 个节点。当我遍历 innerHTML 并在每个 CSSStyleDeclaration 哈希中应用样式时，即对 node.style.setProperty(key, value) 进行了 650,000 次调用。但是，通过循环迭代，我正在逐个处理每个节点。相反，一次对 DOM 进行 1000 次调用而不是执行此循环会更有效率。问题是，如果这在 Chrome 中是可能的，我不知道怎么做。

我怀疑 Chrome 在整个 DOM 上都有一个 GIL（因为没有更好的词），但这可能只是迷信。如果不是这样，我会假设锁在节点级别。但同样，完全的迷信。我在这个没有事实的环境中运作。如果您有任何指点，我将不胜感激。

Answer 1

首先，DOM 被指定为不是线程安全的，因此您几乎不可能同时应用这些属性。此外，javascript 不是并行的，因此要并行执行这些任务，您必须使用 WebWorker，它不能按原样访问 DOM，唉，不是线程安全的。

其次，您为什么不在文档中创建一个样式表，然后使用insertRule 附加一个新的、动态创建的规则，让浏览器的渲染引擎为您完成工作？