Angular Material setup and performance

Angular Material is configured by default to optimize the package size of your final deliverable. In Angular.JS and Angular Material 1.x, the entire dependent library would be loaded. However, with Angular Material 6, we are able to specify only the components that we intend to use, resulting in dramatic performance improvements.

In the following table, you can see improvement of the performance characteristics of a typical Angular 1.x + Angular Material 1.x vs Angular 6 + Material 6 application over a fiber connection with high speed and low latency:

Fiber Network

Angular 6 + Material 6

Angular 1.5 + Material 1.1.5

% Diff

Time to first page render*

0.61 s

1.69 s**

~2.8x faster ...

Get Angular 6 for Enterprise-Ready Web Applications now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.