javascript - 优化 Ext.tree.TreePanel 性能

Question

我有一个与 AsyncTreeNodes 一起使用的 Ext.tree.TreePanel。问题是最初根节点需要有超过 1000 个后代。我成功地优化了数据库性能，但 JavaScript 性能很糟糕——添加和渲染 1200 个节点需要 25 秒。我知道操作页面的 DOM 是一个缓慢的操作，但也许有一些方法可以优化初始渲染过程。

Answer 1

您可以创建一个具有较低 DOM 占用空间的自定义树节点 UI。换句话说，将用于创建树的每个节点的 HTML 更改为一些不太冗长（并且可能不太灵活）的 HTML。

这里有一些这样做的参考：

http://github.com/jjulian/ext-extensions/blob/master/IndentedTreeNodeUI.js

http://david-burger.blogspot.com/2008/09/ext-js-custom-treenodeui.html

享受。

Answer 2

我认为优化具有这么多节点的树不会有太多运气。有什么方法可以使用网格来传递信息？你至少可以用它来设置分页，而且它可能会快很多。您还可以在网格上实现行扩展器 UX，它的行为类似于每行的树。