What’s new in Angular 11
Highlights of the latest upgrade to the Google-developed web framework include stricter types, router performance improvements, and automatic font inlining
Angular 11, the latest upgrade to the Google-developed web framework, has just been published as a production release. Highlights include stricter types, router performance improvements, and automatic inlining of fonts.
With this last feature, apps are made faster by speeding up the first contentful paint. During compile time, the Angular CLI will download and inline fonts being used and linked in the application. Automatic font inlining will be enabled by default in apps with Angular 11. Applications will need to be updated to take advantage of this.
Available on GitHub, the Angular 11 production release follows a series of beta versions and release candidates. Other improvements in Angular 11 include:
- Performance improvements and new APIs, with the
parallelfunction making it easier to work with asynchronous actions in tests by enabling multiple asynchronous interactions with components in parallel.
- Stricter types are added for
DatePipeand number pipes, to catch misuses such as passing an Observable or an array.
- Improved reporting and logging.
- An update to the Angular Language Service, providing a more powerful and more accurate experience.
- An update to Hot Module Replacement (HMR) support leverages the CLI to allow enablement of HMR when starting an application with
- Experimental Webpack 5 support offers a path to faster builds with persistent disk caching and smaller bundles thanks to CommonJS tree-shaking.
- TSLint has been deprecated, with project creators recommending migration to ESLint.
- For the Angular compiler,
keySpanwould be added to the
- The router in Angular 11 would change the default value of
relativeLinkResolutionfrom “legacy” to “corrected.” The migration updates
RouterModuleconfigurations that use the default value to now specifically use “legacy” to prevent breakages during updating.
- In a fix to the core, a Trusted Types policy is being introduced in the development mode. It allows arbitrary unsafe conversions to Trusted
- Types to support development features. Also, a module is being added to create a Trusted Types policy for use internally by Angular.
- New initialNavigation options are being added to legacy functionality.
- For code refactoring in the router, the type of parameter in
createUrlTreeis being adjusted to be more accurate.
- To improve router performance,
ngDevModecan be used to tree-shake error messages.
- For service-worker, an
UnrecoverableStateErrornotification is being added, fixing an issue in which a broken state would arise where only parts of an application would load properly. This situation has arisen when the browser has evicted eagerly cached assets from
- the cache that cannot be found on the server anymore.
- Support is removed for the Microsoft IE 9 and IE 10 browsers as is IE mobile support.
- ISO week-numbering year formats support is being added to
- For the compiler-cli, interfaces are being defined that can be used for
TemplateTypeChecker. Performance improvements have been made to compiler-cli, also.
- For the core, a migration is being added that finds all imports and calls to the deprecated
- and replaces them with
nullis now included in the types of
- A multitude of bug fixes are planned, including an improvement to typing of common pipes and another fix to ensure
TestBedis not instantiated before the override provder.
- TypeScript 3.9 support has been removed from the compiler. An upgrade to TypeScript 4.0 is advised.
A roadmap published for Angular, listing features either in development or eyed for the future, cites capabilities including native trusted types and strict typing for forms. The Angular 10.1 point release, with compiler and router improvements, was released on September 8. Angular 10.0, with tool and ecosystem capabilities, arrived on June 24.