Just after everyone was settling down with the biggest release of Angular since AngularJS, Angular has rolled out yet another new version. Angular 10 is a significant update to the popular web development framework. The latest version of the Google-developed typescript-based framework focuses on tools, quality, and ecosystem improvements rather than new features. Angular 10 is smaller than the previous versions of Angular.

Let’s unfold the major features of the Angular 10 one by one.

Features

TypeScript updates

This upgrade feature is compatible with TSLib 2.0, TypeScript 3.9, and TSlint 6. It is important to note here that the TypeScript 3.9 is a breaking change and the update is not supported for TypeScript 3.8 and below. By staying up-to-date with the newest libraries of TypeScript, it ensures that the project does not have outmoded codes.

Date-range picker

This is a handy update that comes with Angular Material which allows for the selection of date range. One can select the start and the end date which is apt for creating forms during the time of employment, bank tenures, etc.

Change in default browsersda

Default ES5 builds have been disabled for new projects paving the way for new default configurations to be set. Users can enable the browsers that they require by editing the browsers listrc file. The abandonment of the ES5 build allows for smaller bundle sizes along with faster compilation time.

Strict mode

Strict mode allows you to build a brand new workspace/project that enhances maintenance, aids in early catching of bugs and facilitates advanced optimization processes by the CLI.

If we elaborate, these are the important points:

• Strict mode can be enabled in TypeScript along with the other strictness flags that are recommended by the TypeScript team especially noImplicitReturns, forceConsistentCasingInFileNames, noFallthroughCasesInSwitch, etc
• The strict mode turns on strict strict Templates, Angular compiler flags, and strictInjectionParameters
• It reduces the bundle size budgets by ~75%
• It turns on the none-tslint rule to forbid declarations of the type any
• The strict mode stamps your application as “side-effect free” that enables advanced tree-shaking

It can be enabled by calling:

ng new –strict

Allowing stricter TypeScript rules will improve your application’s optimization in the long run.

Package format optimization

The angular package size does not contain any more EM5 or FESM5 packages. The download memory will save 119 MB to minimize the angular installation time. The cycle to start new areas/projects is speeded up substantially.

Removed & deprecated features

Some wrappers and classes in this new release are deprecated like the @angular/core, ResolveOptions, resolve, and @angular-devkit / core terminal.

The other new features of Angular 10 are:

• TSlib, the TypeScript runtime library with support functions, was modified to TSlib 2.0. The TSLint TypeScript static analytics tool has been upgraded to TSLint 6.
• A compiler interface has been introduced that wraps the existing ngtsc compiler. Utilizing the project interface, the language service-specific compiler manages several type check files constructing Scriptinfos as necessary.
• Name spans have been included for method calls and property reads for the compiler.
• A program-engineered entry-point finder(EntryPointFinder) is added. It can be seeded in a program from the imports specified by a tsconfig.json file. It is anticipated to be much faster than the DirectoryWalkerEntryPointFinder when the active program actually imports a minuscule fraction of the entry points that are installed.
• Due to the questionable importance and the performance issue, autocompletion is removed from the HTML entities such as &amp.
• Explicit mapping has been exposed(closure to devmode files). This characteristic is aimed at development tools that are tasked with the translation of production build inputs into their equivalents in devmode.
• Improvements in type-checking performance are made to the compiler-cli.
• The computation of basePaths is lazier now so that work is only done if required in TargetedEntryPointFinder in order to improve performance.
• Multiple translation files can be merged now. Earlier, only one file was allowed per locale. Now users can define several files per locale and messaging ID is used for the merging of transactions from each file.
• Configuration of async locking timeouts is now possible. This lends support to the ngcc.config.js file that sets the retryDelay and retryAttempts options for the AsyncLocker. A new check is added for a timeout by an integration test that utilizes the ngcc.config.js to reduce the timeout time. It helps to avert lengthy time for tests.
• In a new change, all warnings regarding unknown elements are logged as errors now. It can potentially trip up tools that do not want anything to be logged via console.error.
• In another new change, navigation will be cancelled for all resolvers which return “EMPTY”. For continuation of navigation, developers should update the resolvers(to update a value like default!Empty)
• Ng-content selectors to metadata and dependency information have been added. This revolutionary compiler feature will facilitate additional metadata important for tools like the Angular Language Service that offers the capability to furnish suggestions for components/directives defined in libraries.
• Immediate reporting of a stale lock file has now been allowed for the enhancement in ngcc performance. In addition to that, a cached copy of all parsed tsconfig files is stored for reutilization if the tsconfig path is the same.
• In a new change to the core, logic can now be added to decorate derived classes of the undecorated classes that utilize Angular features.
• Urlmatcher’s type now reflects that it can always return null.
• There have been many bug fixes including the compiler that prevents ambiguous terms in a holey sequence, and the core that avoids migratory bugs when importing a non-existing symbol. Modules affected by the overrides in TestBed can now be identified.

EndNote:

The sweeping changes that Angular 10 has brought is here to stay for a while. If you are looking to hire Angular developer, you need not worry as it won’t take much time for the coders to adjust to the new Angular environment as the new changes are mostly aimed at improving efficiency. The commitment of the Angular team to keep Angular up-to-date and relevant is praiseworthy.