Angular bootstrap performance

[Krzysztof Bogdan]

I have performance issue on application start.

Angular is processing "all" of DOM elements on boostrap and I ended up with 10k directives created by compileNodes (compile.js#L1352) 

Most of those directives will not be created on beginning, for example - inside ng-if="false".

One way to postpone DOM processing is to use ng-include like mechanism: http://plnkr.co/edit/bzpn5hQ8BlBTyq4ueT4u

But is it possible to implement "lazy-content": http://plnkr.co/edit/RodkzEcknwWhaUm0wWrL

in a way that inner content will not be picked by compileNodes?

[Sander Elias]

Hi Krzysztof,

If you have 10K of elements in your pages (with or without directives) I would advise to split up the page anyhow. Even without angular that would be slow.

Angular hands you to tools to do this fairly easy. the ngInclude you mentioned helps. Probably you need some routing too (ngRouter for simple cases, ui-router if you can't wait for ngComponentRouter)

ngIf can also help a bit, but it takes out nodes, that the browser has to process anyhow.

Regards

Sander