What’s new in Angular 8.0?

The 8th release is majorly about a new Angular compiler – Ivy and the possibility to give it a try, but a new version also features some serious changes. Fortunately, for a skilled frontend programmer the update would be easy to learn, considering the fact that the Angular team wrote a scope of schematics that will clarify everything. 


In the article below, we will consider the main updates which Angular 8.0 brings on the stage. 

TypeScript 3.4

Angular 8.0 now requires TypeScript 3.4, a new version of the language, so upgrade is necessary.

Ivy

Ivy (a new Angular’s compiler)  is definitely a significant part of the release. It changes how the framework works internally. Ivy allows to reach better build times, increase build sizes and unlocks several new features. 

This compiler aims to be compatible with the existing applications, and it is planned to make Ivy a defaul feature in all upcoming Angular versions. 

Bazel support

Bazel is a powerful build tool launched by Google. What is interesting,  the Angular framework itself was built with Bazel. 

One of the Angular 8 new features is the possibility to simply build CLI application with Bazel. Moreover, it can bring impressive gains on rebuild times.

Forms

markAllAsTouched

Some classes offer new methods in addition to the existing once. For instance, AbstractControl is the parent class of FormGroup, FormControl, FormArray, so the method is available on all reactive form entities.

Like markAsTouched, this new method marks a control as touchedbut also all its descendants.

FormArray.clear

The FormArray class now also offers a clear method, to quickly remove all the controls it contains. Developers previously had to loop over the controls to remove them one by one.

// users is initialized with 2 users

const users = fb.array([user1, user2]);

users.clear();

// users is now empty

Router

Lazy-loading with import() syntax

A new syntax has been presented to declare the lazy-loading routes, using the import() syntax from TypeScript (TypeScript vers. 2.4.)

This is now the preferred way to declare a lazy-loading route, and the string form has been deprecated. 

Other changes

A few characrestics have changed and require some effots from developers. Several changes are driven by Ivy, and they are introduced to prepare the existing applications for upcoming modifications. Anyway, the great news is that the Angular creators has already wrote schematics to make developers’ life easier.

A developer can simply run ng update @angular/core and the schematics will update the code. 

To prevent breaking of the existing applications and to make migration easier, the creators’ team wrote a schematic that automatically analyzes an application, and adds the static flag.

To add, it will not be possible to reassign a value to a template variable (here option) because of Ivy. To prepare the switch to this compiler, a schematic analyzes your templates when you upgrade to Angular 8.0 and warns you if that’s the case.

To check the full list of Angular 8.0 updates, you can visit the official page edited by Angular creators’ community. 

Finally, Angular 8.0 looks like a promising and quite predictable update. A new compiler – Ivy will change the application development process as well as make the compilation process quicker. Other above-mentioned features will affect the development process efficiency and they are going to make developers’ life easier. To receive even more perks from a constantly-developing Angular, the community is waiting for a new release in the late November 2019. 

Ninja Squad and Angular Blog materials were used during the article creation.