XML 解析与 DOM 实现创建方法

Question

我记得很清楚，使用 DOM 实现在文档上创建新的 HTML 元素被认为比将 HTML 字符串分配给适用 HTML 元素的“innerHTML”属性要慢得多。

使用 JavaScript 创作 XML 文档时是否同样适用？与使用 DOM 实现的各种创建方法相比，直接生成 XML 字符串并解析它会更快吗？

只是我想知道的事情......:)

*编辑 - 添加了一个示例 *

哪个更快？ （我将使用 jQuery 的 parseXML 函数来执行解析示例）：

var myXdoc = $.parseXML("<person><name>Bob</name><relation>Uncle</relation>");

或者

var myXdoc

if (window.ActiveXObject) {
    myXdoc = new ActiveXObject("Microsoft.XMLDOM");
    myXdoc.async = false;
}
else if (document.implementation && document.implementation.createDocument)
    myXdoc = document.implementation.createDocument("", "", null);

var p = myXdoc.documentElement.appendChild(myXdoc.createElement("person"));
var n = p.appendChild(myXdoc.createElement("name"));
n.appendChild(myXdoc.createTextNode("Bob"));
var r = p.appendChild(myXdoc.createElement("relation"));
r.appendChild(myXdoc.createTextNode("Uncle"));

Answer 1

首先我们必须知道为什么 createDocument() 可能会很慢。原因是 DOM 是活动的，如果您修改它，它会触发 DOM 树的重新验证，并且可能会触发站点的重绘。每次。但是我们可以通过使用 createDocumentFragment()。 DocumentFragment 不是 DOM 的一部分，因此它不会触发任何事件。因此，您可以构建完整的 DOM 部分，并在最后一步将其附加到 DOM 树。我认为这是创建大型 DOM 部件的最快方法。

更新
我在 Firefox 7 中使用 Firebug 对其进行了测试。代码：

console.time("a");
for(var i=0; i<1000; i++) {
$.parseXML("<person><name>Bob</name><relation>Uncle</relation></person>")
}
console.timeEnd("a");

console.time("b");
for(var i=0; i<1000; i++) {
var myXdoc
if (document.createDocumentFragment) {
    myXdoc = document.createDocumentFragment();
}
var p = myXdoc.appendChild(document.createElement("person"));
var n = p.appendChild(document.createElement("name"));
n.appendChild(document.createTextNode("Bob"));
var r = p.appendChild(document.createElement("relation"));
r.appendChild(document.createTextNode("Uncle"));
}
console.timeEnd("b");

结果：“a”约 140ms，“b”约 35ms。所以字符串解析版本比较慢。

更新2
很可能第二个变体在任何其他浏览器中也更快。因为解析方法也必须构建 DOM 对象，并且很可能它使用相同的方法（例如：document.createElement）。所以解析方法不能更快了。但它比较慢，因为它必须首先解析字符串。