Writing Robust AngularJS Web Applications
- Be able to identify and address CPU-utilization and memory-consumption
bottlenecks in AngularJS applications. You will be well prepared to recognize
performance-sensitive patterns before any code is written, as well as use
performance-monitoring tools to spot problems in already existing code-base. - Understand performance implications of using the ng-repeat directive with
large data sets.
Understanding the inner workings of AngularJS
To understand performance characteristics of AngularJS applications, we need
to poke under the hood of the framework. Getting familiar with the AngularJS
machinery inner-working will allow us to easily identify situations and code
patterns that have a major impact on applications' overall performance.
It is not a string-based template engine
Looking at simple code examples we might get an impression that AngularJS is yet-
another client-side template engine. Indeed, just by looking at the following code:
Hello, {{name}}!It is impossible to distinguish AngularJS code from a regular template system, say,
Mustache (http://mustache.github.io/). The difference only becomes apparent
if we add the ng-model directive:
<input ng-model="name">
Hello, {{name}}!As soon as we do so, the DOM gets updated automatically in response to the user's
input, without any further intervention from a developer. The two-way data binding
might look like magic at first. Rest assured AngularJS uses only solid algorithms to
bring the DOM tree to life! In the subsequent sections we are going to dissect those
algorithms by examining how changes from DOM are propagated to the model and
how model updates trigger DOM repaints.