$ Vs ng-repeat interpolation performance and one-time binding

Question

At http://www.binpress.com/tutorial/speeding-up-angular-js-with-simple-optimizations/135

it is written that for directives it is better to use interpolation than ng-repeat:

The ng-repeat directive is most likely the worst offender for which means that it can be easily abused. ng-repeat probably deals with arrays of $ scope Objects and these are hammers of $ digest loop performance.

For example, instead of rendering global navigation using ng-repeat, we could create our own navigation using the interpolation provider $ to draw our template against the object and convert it to DOM nodes.

When using angular 1.3, we can use ng-repeat with one-time bindings to achieve the same result.

Can $ interpolation be used for this purpose?

Answer 1

I would recommend bindonce for this, if you're at <1.3, just add bindonce next to your ng-repeat and change the ng-* directives to bo-* in the repeating part. This basically does the same thing as 1.3 one-time bindings.

If on your question you would like to use $interpolate instead of a single binding in 1.3, I would say go with ng-repeat with a single binding, as there are no watchers to slow you down, and it is more readable. Although ng-repeat still creates child areas, the performance difference is not significant if you do nothing in these areas.

From experience, you will encounter performance issues in your browser when rendering many elements before $digest becomes a problem if you don't check the watchers, even with a lot of child areas.