Top new features in Angular 9

The wait is finally over! Angular version 9 is here with numerous updates and features for developers and organizations to explore. Let’s admit it, we all have been keeping tabs and have been patiently waiting on Angular 9 release. Angular 9 is a major update to the Angular framework and has the full potential to change the ecosystem.

Angular 9 does not come with a new router or module, but instead, it focuses more on the compilation and effectiveness side. One of the most notable changes in Angular 9 is Ivy. Ivy is now a default compiler and runtime, and it improves the bundle size and type sizing as well.

Here are some of the major highlights in Angular 9 update:

  • Ivy by Default – The ivy engine is a new generation compilation pipeline, and it will be responsible for the running phase, rendering, and the framework context as well. This also means that our bundles will be up to 40% smaller after deploying the Angular 9 version
  • Lazy Loading of Components – We all know about the integration of Lazy Loading in the earlier versions of Angular, wherein the metadata was used for individual components at a module level. Now with Angular 9 update, Ivy stores the metadata directly in the components, making it easy to obtain them separately.
  • Better i18n – i18N has been in existence since Angular 2, it generated one build per locale and adjusted the translation texts, however, it came with its own disadvantages. One of the main problems being time-consumption. Angular 9 comes with a new solution to compensate for the demerits, introducing @angular/localize. Initially, it creates a single build and then creates a copy and inserts translation texts. In addition to that, @angular/localize adds metadata to each copy to format numbers and dates.
  • Any and Platform – Angular 9 took a step forward in the Treeshakable providers API by adding two more elements for providedIn – any and platform. The value any causes each scope to have its own service instance at the module level, whereas, the platform setting register a service in the platform injector.
  • Dev server – Server-side rendering (SSR) is certainly not an important factor for a project, but it is definitely important when it comes to Angular projects. SSR focuses only on browser-based versions of the project and not on the server-based version. Angular 9 comes with an all-new builder that rebuilds on both versions and also updates the browser window. In order to access this solution, all you got to do is run the npm script dev:ssr after adding the corresponding @nguniversal package.

With Angular 9, we finally get to explore the long-waited ivy, offering the potential for innovations and of course the lazy loading of components is something to look into.

Angular Blogs

Translate »