1

在我们的应用程序中，我们有一个树（使用 Ext.tree.Panel 创建），并且有一些节点具有大约 2500 个子节点。

当我们尝试将数据加载到树中时，Internet Explorer 显示一个弹出窗口，提示“脚本导致 Internet Explorer 运行缓慢，停止运行脚本？”。

我们发现如果子节点小于 500 IE 不会出错。因此，我们尝试一次仅加载 400 个子节点，并在单击页面上可用的按钮时加载剩余的子节点。

不幸的是，IE 仍然报错。我刚刚创建了我们正在尝试使用 jsfiddler 执行的操作的示例。以下是链接。

代码示例在这里

结果在这里

下面是代码。

函数 addNodes() { var node = Ext.getCmp('sampleTree').items.items[0].node.childNodes[0];

for (var cnt = 0; cnt < 400; cnt++) {
    node.appendChild({
        "task": cnt + "Hello",
        duration: cnt,
        user: 'Tommy Maintz' + cnt,
        iconCls: 'task',
        leaf: true
    });

}

};

关于如何解决这个问题的任何建议？

4

1 回答 1

1

默认情况下，ExtJS Tree 是一个非常重的组件。对于你给的代码，每次添加一个节点，都会做一次完整的布局计算。如果您没有关闭动画，计算会发生几次。树的性能改进的两种方法。

  • 在开始添加节点之前暂停布局，并在添加所有节点后恢复布局。参考Ext.suspendLayoutsExt 文档中的方法。
  • 强制关闭动画animate:false ；这会稍微影响用户体验，因此您甚至可以考虑使用这些Ext.isIE 方法为 IE 设置此选项
于 2014-05-23T13:36:27.403 回答