通过下拉列表在数组之间切换需要相当多的时间。我该如何减少它？ Angularjs ,IvhTreeview

Question

页面加载后，我通过 rest-angular 请求获取了两个数组。稍后我使用 angular 模块 - ivh-tree view 来显示它们。两个数组相差 10^3 个元素。 问题：通过下拉菜单在它们之间切换需要相当多的时间。我该如何减少它？？

Answer 1

我相信任何解决方案都需要修改 ivh-treeview 以提高自身效率。

快速浏览一下 ivh-treeview 的源代码，它似乎总是渲染整个树并随着节点的展开和折叠切换可见性。

如果您将指令修改为最初只渲染已经展开的节点，然后按需渲染，那么它应该会大大提高性能，因为您只会渲染您实际需要的内容。

另请注意，ivh-treeview 有大量嵌套的中继器，但从未指定 track by（作为通用控件，它不一定）。如果您更改要求为每个树节点提供一个 id 字段，那么您可以将 track by 添加到对性能有积极影响的转发器（但小于延迟加载）。

另请注意，作为嵌套中继器的大型递归结构，通过将数据转换为具有深度标识符的平面列表，然后将整个树渲染为具有 css 的单个列表，可能会提高性能来控制深度。这失去了嵌套节点的语义优势，但可能对性能产生积极影响。它还会使树的许多部分复杂化，因为您失去了嵌套结构和几乎自动扩展和折叠的好处。