Angular v12 Released, Transitions to Ivy Rendering Engine

From online banking to e-commerce, healthcare to social media platforms, billions of individuals are using the web and mobile applications for almost everything they do daily. These applications are made to help us out at solving our daily problems and offer seamless user experiences and interfaces. But, have you ever thought of how these applications were built to give this security and reliability? Most of the credits go to frameworks like Angular, which has made it easy to build these sorts of strong applications.

Angular is a component-based framework for building web applications. It’s a development platform that was set up on TypeScript and has a great set of perfectly integrated libraries that include features. These features have routing, forms management, client-server communication, etc. You will find various developer tools that will assist you to create, test, and later update your code.

Angular has its own way of turning the job of updating as easy so you can take benefit of advanced developments with zero effort. It offers you productivity comprising scalable infrastructure that backs Google’s heftiest apps. The most awaited upgrade to Google’s famous TypeScript framework is now here and it’s Angular 12. Moreover, Angular v12 boosts the language much closer to Ivy everywhere. It’s a way to modify the Angular ecosystem to the Ivy compiler. What’s Ivy? It is described as a next-generation compilation offering a better accelerated AOT compilation. Now working libraries employing Vie engine will certainly work well with Ivy applications too. However, some library authors are suggested to commence transitioning to Ivy. Due to this, in the coming time, the View engine will be gone completely.

What’s New in Angular 12 Release?

Angular v12 has a lot to offer and its team is right now working TestCafe, Cypress, and WebdriverIO to assist various users to select other solutions.

1. IVY Engine

The View engine has recently been disapproved and is removed completely in the near future. Also, the libraries running now with the view engine will ultimately work with Ivy apps. This particular release is mainly focused to build the transition to Ivy. Moreover, it is completely focused on Ivy’s everywhere approach.

2. Nullish Coalescing

For a long time, it has been encouraging developers to write cleaner code in TypeScript classes for some time. Now, with the arrival of the Angular 12 version, you can add some power of Nullish coalescing to Angular templates.

3. Stylish Improvements

There was a time when Sass was easily available in external resources due to the Angular compiler. But, now the components of Angular will entirely support inline Sass in the styles area of component decorator. You need to add “inlineStyleLanguage”: “scss” to angular.json to permit this specific feature in your already running applications. Otherwise, you will find it there in fresh projects using SCSS.

If your current application is employing Angular material or CDK, then you have to ensure that you have shifted from node-sass to sass npm package. Also, when you are updating your application to v12, it will automatically modify to the fresh sass API by updating your app with an ng update.

4. Support Added for Tailwind CSS

Now, you have to install the tailwindcss package from npm first. For this, start Tailwind to create the tailwind.config.jsin your project. Your teams is now ready and set it to begin using Tailwind in Angular v12.

5. Bye Bye IE11

Angular’s new update has a fresh deprecation warning message and will eventually delete support for IE11 in its 13 version.

6. Compilation and Build Updates

If you are running ng build, then it will set your production environment as defaults. Now, you will see a strict mode that can be enabled by default in the CLI. Certainly, the Ivy-based language service is transforming from opt-in to on by default. This specific language service helps in boosting your entire productivity while building applications by showing the best features such as code completion, hints, angular templates, errors. There is a production-ready variant of Webpack 5 which will work great with Angular v12.

Some Added Features and Enhancements in the Version 12 Release

• Strict mode that assists in finding errors is approved by default in the CLI.
• The Ivy language service is migrating from choose-in to on by default. This boosts productivity while building applications.
• There was a time when an experimental support was added for Webpack 5. Currently, they have said the launch of a production-ready version of Webpack 5 is sure.
• It is also looking to update the supported TypeScript version to 4.2.

Conclusion

Here, you must have learned and explored some fresh attractive features of Angular 12. We know that Ivy is moving ahead now and you will face less ngcc errors as the entire ecosystem migrates. Also, the whole Angular team has been working their best to serve the entire community in several areas. This particular launch also shows a production-ready version of Webpack 5 support. Moreover, there are a plethora of other remarkable alterations with this launch, so go and check it. This is all for now and keep on updating your applications. Clear all your queries related to Angular if you face certain issues.