How will you improve performance of an AngularJS application?

1.	How will you improve performance of an AngularJS application?
Answer» AngularJS makers have recommended the below two approaches for performance OPTIMIZATION in the production environment. They are: Enable strict DI mode: This can be achieved by making use of the directive ngStrictDi and can be implemented as: <html ng-app=“myFirstApp” ng-strict-di> Disable debug data: This can be achieved by using the debugInfoEnabled method of the $compileProvider service as shown below: app.config(function ($compileProvider) { $compileProvider.debugInfoEnabled(false);}); Apart from the above two, we can also improve the performance by following the below tips: Implementing one-time binding whenever possible. By making $httpProvider use the applyAsync feature. - - By refraining from creating many $watchers UNNECESSARILY as too many of the watchers will lengthen the digest cycle thereby reducing the speed. If you have scenarios like repeated data calculations of the same nature, then we can make use of the $cacheFactory directive to store the data to avoid recalculations. In case we have a large number of elements to be looped, then instead of LOADING everything at once, pagination or infinite SCROLL can be implemented to reduce the data load. AngularJS PROVIDES ngInfiniteScroll directive for accomplishing the infinite scroll feature. For more information regarding the tools that can be used to measure AngularJS performance, you can read here.

Answer»

AngularJS makers have recommended the below two approaches for performance OPTIMIZATION in the production environment. They are:

Enable strict DI mode: This can be achieved by making use of the directive ngStrictDi and can be implemented as:

Disable debug data: This can be achieved by using the debugInfoEnabled method of the $compileProvider service as shown below:

app.config(function ($compileProvider) { $compileProvider.debugInfoEnabled(false);});

Apart from the above two, we can also improve the performance by following the below tips:

Implementing one-time binding whenever possible.
By making $httpProvider use the applyAsync feature. - - By refraining from creating many $watchers UNNECESSARILY as too many of the watchers will lengthen the digest cycle thereby reducing the speed.
If you have scenarios like repeated data calculations of the same nature, then we can make use of the $cacheFactory directive to store the data to avoid recalculations.
In case we have a large number of elements to be looped, then instead of LOADING everything at once, pagination or infinite SCROLL can be implemented to reduce the data load. AngularJS PROVIDES ngInfiniteScroll directive for accomplishing the infinite scroll feature.

For more information regarding the tools that can be used to measure AngularJS performance, you can read here.

Discussion