Skip to content

Too many angular handlers #23

@ceilino

Description

@ceilino

First of all, its a nice looking widget. Thanks @AlexSuleap

Taking a look at the code of the library and some example in my own code, this are my findings:
1)
The root problem in this widget is that is generates way too many angular handlers.
Tree data structure tend to be larger biggish. (that's why we often need them)
A simple list of some hundreds of items will easily take 2000 angular handlers.

(Recomendation for a webapp based on angular, in total, not to exceed 3000 handlers, so its of course dificult to have a widget that consumes 66% already by itself)

I think, in general with widgets, relying too much on angular to generate the widget html is a very expensive thing to do, and does not scale.

Summary:
I think one has to rewrite several parts of the widget to improve the performance. Perhaps the following will help:

  1. Use ng-if for collapsed nodes, so that they don't consume handlers.
  2. Use a single ng-click for whole tree, and generate uuid attribute for all nodes (with single-bindings) so that its easy get back the node in that simplified ng-click.
  3. Remove usage of ng-classes as much as possible. Replace it with direct DOM manipulation when possible.
  4. Optimize ng-repeats by using 'track by' with the node UUID, otherwise they need to be generated.
  5. Difficult: think of a way to remove ng-repeats.
  6. Add option to disable animations.

I think this would reduce by 80-95% the angular handlers, and definitively the rendering will much faster.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions