Angular 10: Latest Features & Updates

Angular Development

Angular 10 has been released in the beta version on 24th June 2020. Note that this version is smaller than the previous versions of Angular. You can expect this updated version to focus more on the ecosystem rather than the overall features. Every release of the Angular version is picking up an unexpected pace. Whether you are a web app developer or not, these are some of the features in the latest update. Let’s have a look at the key features and updates that Angular 10 holds for us!

Warning on CommonJS Imports

When you include a dependency on the CommonJS of your application, your app loading speed and functionality will get affected. In the case of Angular 10, developers get warnings about using dependencies combined with CommonJS.

The Option of Stricter Settings

You can get a stricter project setup while making a new workspace using ng new in Angular 10. Once you allow this flag, the new project will begin with new settings. These settings are to improve the maintainability, allowing the CLI to perform advanced optimizations on the application, and catching the bugs beforehand.

New Date Range Picker

The latest Angular version has an all-new date range picker. For utilizing it, you can use elements of both – mat date range picker and mat date range input.

Improved Community Engagement

Angular has a global community of developers who constantly offer valuable solutions for angular projects. Along with the release of Angular 10, the organization has revealed its plan of investing in the community to make the platform better. As the Angular community is making efforts in providing assistance, the number of problems can be reduced to a great extent.

Boost in the ngcc Performance

A lower entry point size can boost performance. Moreover, now the dependencies will be hidden inside the entry point exhibit and read from there as compared to it being computed every time. Even though earlier entry point didn’t need processing, ngcc may analyze the entry point files to compute the dependencies. It may take a lot of time in the case of large_node modules.

Removals & Corrections

The Angular team has done much reduction and removed some of the things from this platform. For instance, FESM5 or ESM5 bundles have been removed from the Angular Package Format and the file size has been reduced by a minimum of 119 MB. Furthermore, assistance for some of the old browsers like Internet Explorer Mobile and Internet Explorer 9 and 10 has also been removed.

Generic with ModuleWithProviders

In Angular 10, it is compulsory to use generic keywords with ModuleWithProviders. It has been added to make the ModuleWithPatterns work with the rendering sequence and Ivy compiling.

Bug Fixes

Many bug fixes have been carried out in Angular 10. It includes the removal of unaddressed examples of range in the compiler and the mistakes that are done because of migration when the symbol does not exist. The Terser Inlining Bug is also fixed in Angular 10.

Combination with Many Transition Files

The new features in Angular 10 allow developers to merge many files in a single attempt. Also, the file transaction can be done via messaging functions.

Compiler Update

In this latest version of Angular, a compiler interface has been included to wrap the actual ngtsc compiler. This version has name spans for property reads and method calls. Apart from the Dependency information, Angular language service and ng-content selectors have also been included in the metadata.

Converting pre-Ivy Code

The pre-Ivy dependencies from npm need to be converted to Ivy dependencies, which is supposed to work as a precursor to running ngtsc at the application. All the further compilation and linking operations should be made towards transforming versions of the dependencies.

Resolver Returns Empty

You can leave navigation with the help of this feature. All you need to do is define a resolver that can return empty. To continue with the navigation, you need to update the resolvers for some default value.


How Can You Update to Angular 10?

You can find the general release of Angular 10 on GitHub. To update your current Angular installation, run the below-mentioned command: 

ng update @update/cli @angular/core

That’s A Wrap!

The Angular team usually releases two versions every year. The team released version 9 four months back. You can expect the release of the Angular 11 version in fall. Overall, it can be said that Angular 10 is not only going to make the job of developers a little easier but also ensure that the final outcome is seamless and impressive.

Leave a Reply