5 new changes in Angular 13 - The latest Angular Framework

by Indraneel Pole



So, as every six months, Angular team is back with a newer version, an update to Angular 12, with version 13. Angular 13 is the latest in the arsenal of Angular framework, a web framework used not only to build Websites and Web-Apps but also cross-platform mobile applications.

In this blog, we are going to look at the 5 things that are changed/newly introduced in latest version of Angular framework - Angular 13.

1. Full Ivy support - Ivy support has been in there in Angular for a while now. Ivy is the complete rewrite of the Angular's rendering engine. Actually to be more accurate, it is the fourth rewrite of the Angular's rendering engine, and third since Angular 2 - a version that redefined Angular completely. Since Angular 8, Ivy is available to be used in your projects, but Angular still had backward compatibility with older rendering engine - View Engine. In Angular 8, you had to explicitly Opt-In for the Ivy Engine, since Angular 9, Ivy became standard, and starting with Angular 13, it will be the ONLY rendering engine Angular supports. Meaning, if you are upgrading to Angular 13 and are still using View Engine in your project, you have no other option but to also switch to Ivy.

2. IE 11 Support is removed - I am surprised, Angular kept the IE11 support until so long, but given that a lot of Enterprise applications are written using Angular Framework, they probably had no choice but to support it. Nonetheless, starting Angular 13, the support for IE11 is now officially removed. This is a breaking change and will affect you if your userbase is not yet switched to new Edge or other modern browsers.

If your website/web-app is predominantly used on IE, it is better not to update to Angular 13.

3. Support to enable Built-in validators dynamically - This is honestly a feature that is going to be very useful for me in my projects. You can now enable or disable the built-in validators like min, max, minLength maxLength, email dynamically, meaning no need to write custom workarounds for this. So you can use the validators in the same form conditionally in different use-cases.

4. New type for Forms - For Angular Forms, a new type FormControlStatus has been introduced. It is a union of all the status strings possible for form control. Also the old AbstractControl.status has change of type. From previous type string, it is now shifted to this new type FormControlStatus. Additionally, the StatusChange is now of type Observable instead of old Observable

5. Improvements of Component API - With update to ViewContainerRef.createComponent API, it has become now easier to create a dynamic component in your Angular App. This will also require now less boilerplat code. This means, with new API, you don't need to use ComponentFactoryResolver in order to create a component dynamically. There is no need to pass the componentFactory to the componentRef anymore.

I hope this list helps you in deciding if the new Angular update is worth the trouble, specially if you are already on Version 12. For me personally, version 13 brings a lot of exciting changes, and I cannot wait to update my project..!

Indraneel Pole