CirclonGroup/angular-tree-component

Large tree load with virtualScroll and isExpanded results in browser crash

binerdy opened this issue · 0 comments

Minimal reproduction of the bug/regression with instructions:

  • Create a large tree (10 root nodes, 4 levels deep, 10 child nodes each)
  • Use virtual scroll
  • Watch as CPU and Memory usages skyrocket, when trying to load the tree until the browser crashes

Stackblitz Reproduction

If you only go 3 levels deep the tree can load.

Versions of Angular Tree Component, Angular, Node, affected browser(s) and operating system(s):

10.0.4

Other information:

In tree-node.model.ts the method _calculateExpandedNodes uses Object.assign for every node that should be expanded. Doing it on every call is quite expensive. My suggestion would be to use extendObservable as the mobx documentation recommends. Then when all expandedNodeIds are known we can apply the expansive Object.assign once to update the reference so that the mobx can detect the change and react to it accordingly.

this.expandedNodeIds = Object.assign({}, this.expandedNodeIds, { [startNode.id]: true }

I would be willing to submit a PR to fix this issue

  • Yes (Assistance will be provided if you need help to submit a pull request)