What’s new in Angular 10.1

Angular 10.1.0, a follow-up point release to Angular 10, was released September 2, bringing performance improvements to the compiler and router along with a new message extraction tool. 

Angular 10 became generally available as a production release on June 24. The major upgrade to the Google-developed, TypeScript-based framework put more emphasis on quality, tool, and ecosystem improvements than new features.

Angular 10 is smaller than previous versions of Angular. New capabilities include a new date range picker in the Angular Material UI component library and warnings for CommonJS imports. CommonJS import warnings alert developers when a dependency packaged with CommonJS could result in larger, slower applications, allowing developers to substitute an ECMAScript module bundle.

In addition, optional stricter settings offer a more-strict project setup when creating a new workspace with ng new, via ng new --strict. Enablng this flag initializes a new project with new settings to improve maintainability, help catch bugs, and allow the CLI to do advanced optimizations on an app.

Where to download Angular 10

You can find the general release of Angular 10 on GitHub. To update your current Angular install, you can run this command:

ng update @angular/cli @angular/core

New features in Angular 10.1.0

The Angular 10.1.0 release, available on GitHub, includes the following new capabilities and improvements: 

• To improve performance in the compiler-cli, Angular 10.1 has a fix for performance regressions affecting incremental program reuse.
• For router performance, the prioritizedGuardValue operator is being applied to optimize CanLoad guards.
• ProgramBasedEntryPointFinder will reuse EntryPointManifest to load entry-point dependencies when possible, which avoids having to parse them again on every invocation of ngcc.
• A new message extraction tool is supported, which will eventually be integrated into the CLI.
• For the Bazel build tool, LinkabablePackageInfo is being added to the ng-module rule, allowing the linker to properly link ng_module targets in Node.js runtime actions.
• More insight is added to the diagnostic produced for static evaluation errors.
• An option has been added for absolute URL HTTP support.
• TypeScript 4.0 support has been added to the compiler.
• canparse() diagnostics are exposed.
• Performance improvements have been made to the router, forms, the compiler CLI, and the ngcc compiler compatibility tool.
• Modification of lifecycle hooks can be done any time before bootstrap.
• A number of big fixes are offered for core, router, and other parts of Angular.

New features in Angular 10

Key features of Angular 10 include the following:

• TSlib, the runtime library for TypeScript containing helper functions, has been updated to TSlib 2.0. The TSLint static analysis tool for TypeScript has been updated to TSLint 6.
• A compiler interface has been added that wraps the actual ngtsc compiler. The language service-specific compiler manages multiple typecheck files using the project interface, creating Scriptinfos as necessary.
• The browser configuration for new projects has been updated to exclude older, less-used browsers. Support is deprecated for Internet Explorer 9, Internet Explorer 10, and Internet Explorer Mobile.
• Angular Package Format no longer includes ESM5 or FESM5 bundles, saving download and install time when running yarn or npm install for Angular packages and libraries.
• For the compiler, name spans have been added for property reads and method calls.
• EntryPointFinder, a program-based entry-point finder, has been added that can be seeded from the imports in a program specified by a tsjconfig.json file. This is expected to be faster than the DirectoryWalkerEntryPointFinder when the active program only imports a small proportion of the installed entry points. 
• Autocompletion is being removed from HTML entities, such as &amp, because of questionable value and a performance issue.
• Explicit mapping is being exposed from closure to devmode files. This feature is aimed at development tools that have to translate production build inputs into their devmode equivalents.
• In a breaking change, generic has been made mandatory for ModuleWithProviders. A generic type parameter has been required for the ModuleWithProviders pattern to work with the Ivy compilation and rendering pipeline, but before this commit, View Engine allowed the generic type to be omitted. If a developer is using ModuleWithProviders without a generic type, a version 10 migration will update the code. But if a developer is using View Engine and depending on a library that omits the generic type, a build error will be issued. In this case, ngcc will not help and the migration will only cover application code. The library author should be contacted to fix their library. As a workaround, skipLibChecks could be set to false in tsconfig or updating an app to use Ivy only.
• TypeScript 3.9 is now featured, with support for TypeScript 3.8 having been removed. This is a breaking change. TypeScript 3.6 and TypeScript 3.7 also are no longer supported.
• Type-checking performance improvements have been made to the compiler-cli.
• To improve performance, the computation of basePaths has been made lazy, so work is only done if needed in TargetedEntryPointFinder. Previously, basePaths was computed whenever the finder was instantiated, which was a waste of effort in the case when the targeted entry-point had already been processed.
• Merging of multiple translation files is supported. Previously, only one translation file per locale was permitted. Now users can specify multiple files per locale, and the transactions from each file will be merged by messaging ID.
• Async locking timeouts can be configured. This adds support for the ngcc.config.js file for setting the retryAttempts and retryDelay options for the AsyncLocker. An integration test adds a new check for a timeout and uses the ngcc.config.js to reduce the timeout time to prevent the test from taking too long.
• In a breaking change, warnings about unknown elements now are logged as errors. While this will not break an app, it might trip up tools that expect nothing to be logged via console.error. 
• In another breaking change, any resolver that returns EMPTY will cancel navigation. To allow navigation to continue, developers must update the resolvers to update some value, such as default!Empty.
• The addition of dependency information and ng-content selectors to metadata. This proposed compiler feature would provide additional metadata useful for tools such as the Angular Language Service, offering the ability to provide suggestions for directives/components defined in libraries.
• Performance improvements, achieved by reducing the size of the entrypoint manifest and a caching technique in the manifest. In addition, caching of dependencies is done in the entrypoint manifest and read from there rather than being computed every time. Previously, even if an entrypoint did not need processing, ngcc (Angular Ivy compatibility compiler) would parse the files of the entrypoint to compute dependencies, which would take a lot of time for large_node modules.
• To improve ngcc performance, immediate reporting of a stale lock file is now allowed. In addition, a cached copy of a parsed tsconfig file is stored that can be reused if the tsconfig path is the same.
• In a breaking change, logic has been updated pertaining to formatting day periods that cross midnight. When formatting a time with the b or B format code, the rendered string was not properly handling day periods that spanned days. Instead, the logic was falling back to the default case of AM. This logic has been updated so it matches times within a day period that extends past midnight, so it will now render correct output, such as at night in the case of English. Applications using either formatDate() or DatePipe or the b and B format codes will be affected by this change.
• For the router, the CanLoad guard now can return Urltree. A CanLoad guard returning Urltree cancels current navigation and redirects. This matches current behavior available to CanActivate guards that also has been added. This does not affect preloading. A CanLoad guard blocks any preloading; any routes with a CanLoad guard will not be preloaded and the guards will not be executed as part of preloading.
• Propagation of the correct value span in an ExpressionBinding of a microsyntax expression to ParsedProperty, which in turn would propagate the span to the template ASTs (both VE and Ivy). This proposal also is for the compiler.
• In a fix to the core, logic would be added to undecorated-class migration to decorate derived classes of undecorated classes that use Angular features.
• In a breaking change, Urlmatcher’s type will reflect that it could always return null.
• For the service-worker, a fix has been put in for a situation in which there was a chance that the service worker will never register when there is a long-running task or recurring timeout.
• A number of bug fixes have been made including the compiler avoiding undefined expressions in a holey array and the core avoiding a migration error when a non-existent symbol is imported. There is also a workaround in the core for the Terser inlining bug. Another bug fix properly identifies modules affected by overrides in TestBed.
• Angular NPM no longer contains certain jsdoc comments to support the Closure Compiler’s advanced optimizations. This is a breaking change. Support for Closure Compiler in packages has been experimental and broken for some time. Anyone who uses Closure Compiler is likely better off consuming Angular packages built from sources directly rather than consuming versions published on NPM. As a temporary workaround, users can consider using their current build pipeline with Closure flag --compilation_level=SIMPLE. This flag will ensure that the build pipeline produces buildable, runnable artifacts, at a cost of increased payload size due to advanced optimizations being disabled.