5. Run time performance should bother us?
• Angular core team direction:
• Ivy - Hello world in 2.7 kb
• Better tree shaking
• Dead code elimination
• The rest is in our hands…
6. "We found that 53% of mobile site visits
are abandoned if pages take longer than
3 second to load…”
10. function benchmark(iterations, f) {
var start = new Date();
for (var i = 0; i < iterations; i++) {
f();
}
var end = new Date();
return "Elapsed time: " + (end - start) + " msec";
}
benchmark(1000000, function() {});
11. Why benchpress?
● Rendering time - test the performance impact of stylesheet
changes
● Garbage collection - improve memory usage of applications
● Measure the client side only - ignoring BE calls
● Measure FPS
@angular/benchpress
27. Why Ivy?
• Designed for mobile applications
• Our JS files are the costliest resource on the
page —> main goal: reduce the bundle!
• Easier to debug
• Faster Compilation
• Easier dynamic component loading
28. Caching with service workers
app.component.html
app.component.scss
app.component.ts
29. Caching with service workers
app.component.html
app.component.scss
app.component.ts
app.component.js
app.component.ngfactory.js
30. How does it works?
• The factory became a static method inside the
component def
31. How does it works?
<div>
<span>{{ title }}</span>
<child-cmp *ngIf="show">
</child-cmp>
</div>
47. Why IMMUTABLE.js?
• Enforce immutability - trigger change detection
• Persistent Data Structures = X100 times faster
• Should I always use this library? It depends…