What's new in Angular 11 !!!

Google has released version 11 of Angular, it's very popular Single Page Application framework. The release focuses on improving the developer’s experience, on updates across the platform including the framework, the CLI, and components. Let's start !!

Some very interesting features of Angular 11 are:-

Fonts Download Automatically
Angular import font by default. During integration, Angular CLI will download in-line fonts and connect the appliance. Angular automatically provides this with version 11. You simply got to update your app.

Harness Exploration Election
Angular v9 introduces Item equipment. Provides a strong and readable API to help with the testing of Angular Material objects. This provides developers with how to speak with Angular Material objects employing a supported API during testing.

Issued in type 11, the angular has harnesses for all items. Engineers can now design powerful test suites.

Login and reporting improved
The Angular developer has made changes to the builder class, reporting is more useful during development. In angular, version 11 reports and logs are easy to read.

Improved CLI output formatting

Renewal of Language Service Review
The current Angular version of the language service is predicated on View Engine and today they provide an Ivy-based language service. Now, the language service is going to be ready to properly install common types like TypeScript integrator.

Updated Hot Module Replacement (HMR) Support
Hot Module Replacement (or HMR) is one of the most useful features offered by Webpack. It allows all kinds of modules to be updated at runtime without the need for a full refresh. HMR exchanges, adds, or removes modules while an application is running, without a full reload. This can significantly speed up development in a few ways:

• Retain application state which is lost during a full reload.
• Save valuable development time by only updating what’s changed.
• Instantly update the browser when modifications are made to CSS/JS in the source code, which is almost comparable to changing styles directly in the browser’s dev tools.

In version 11 angular developers reviewed CLI to permit HMR when launching an application with ng serve.

ng serve --hmr

After this command the server starts and therefore the console will also report that HMR is running:

So previously if any updates happen to any code then the entire page is updated now which isn’t possible, templates and designs are going to be updated immediately without the necessity for page updates, and storing data in forms and folding will improve developer productivity.

Roadmap
The angular team has also updated the roadmap to keep users posted about the current priorities. Some announcements in the post are regarding the updates on in-progress projects from the roadmap. This shows the team’s approach to roll out greater efforts that allow developers to provide early feedback that can be incorporated in the final release. They have collaborated with Lukas Ruebbelke, a member of the Angular community, updating the content of some of the projects, which will better reflect the value they provide to developers.

It Builds Fast
Angular 11 brings rapid development and builds a cycle by making updates to other key areas.
With Typecript4.0 integration is quicker and the ngcc regeneration process is now faster than 2–4x quick integration with TypeScript v4.0.

How to update to get version 11

When you are ready to go run this command to update Angular and CLI:

ng update @angular/cli @angular/core

Head over to update.angular.io to find detailed information and guidance on updating.

References:

https://angular.io/guide/updating-to-version-11
https://webpack.js.org/guides/hot-module-replacement/