Kendo UI Treeview 附加功能性能答案

【问题标题】：Kendo UI Treeview append function PerformanceKendo UI Treeview 附加功能性能
【发布时间】：2012-11-27 10:38:04
【问题描述】：

看来下面这个函数的性能真的很差。

treeView.append(children, parent);

这里 treeView 是 Kendo UI Treeview，parent 是子节点的容器节点，children 是大约 150 个新节点的数组（我的场景） .

而且这段代码执行时间超过 7 秒。

我猜 append 功能对于项目集合没有很好的实现，所以也许有一些通过 jQuery 生成 html 的变通方法，但是 Kendo UI Treeview 也应该知道处理未来的新节点正确展开新节点的事件。有什么办法可以提高上面代码的性能？

谢谢你，伊霍尔

【问题讨论】：

【解决方案1】：

对于遇到此问题的人：

最终我调查了 Kendo UI 源代码，而不是原始帖子中的行，我使用了以下代码：

 treeView.dataItem(parent).children.data(children)

在我的场景中效果很好。

【讨论】：

【解决方案2】：

性能是一个相当相对的术语。如果需要 7 秒，那当然不是很好的表现。在我的电脑上append 150 个新节点大约需要一秒钟，但无论如何我可能会建议您进行一些改进。

你如何append节点，一个一个？

for (var i = 0; i < 150; i++) {
    var added = { text:"node" + i };
    tree.append(added, parent);
}

试试这个（构建一个包含所有要添加的节点的数组，然后调用append）：

var added = [];
for (var i = 0; i < 150; i++) {
    added.push({ text: "node" + i });
}
tree.append(added, parent);

在我的电脑中，它从 1105 毫秒变为 787 毫秒。没那么多，但是...

但是，这是插入节点的时间，而不是渲染所需的时间。你的问题是append 还是呈现在屏幕上？

【讨论】：

是的，只有一行（来自我的原始帖子）执行 7 秒。实际上，我尝试了您的两个样本，并且同时尝试了两个样本。我调查了一下剑道源，发现下面这行执行起来要快得多 treeView.dataItem(parent).children.data(children) 你能回答如果使用这种方法可能会出现什么问题吗？