Component Test Harnesses
Updated Hot Module Replacement (HMR) Support
TypeScript 4.0 Support
Webpack 5 Support
Moving to ESLint
Updated Language Service Preview
Other Changes
Component Test Harnesses
Component test harness allows tests to interact with components using supported APIs. This was first introduced in Angular 9. These APIs have the ability to interact with components in a similar way to end-users and tests can insulate themselves against the changes in the DOM.
At that time, this mechanism only supported Angular material. But with the latest release, a Component harness is available for all components.
Updated Hot Module Replacement (HMR) Support
Hot Module Replacement is a mechanism that allows modules to be replaced without a full browser refresh. HMR is not an entirely new thing to Angular and developers were able to use it with previous versions as well. But with Angular 11, the amount of effort you need to configure the HMR has bee reduced drastically and they have provided a CLI command for that.
TypeScript 4.0 Support
With the latest update, Angular team has dropped support for TypeScript 3.9. Now Angular 11 only supports TypeScript 4.0.
One of the main reasons behind this upgrade is to speed up the builds Angular 11 ensures much faster builds than previous versions.
Webpack 5 Support
As you know, webpack is used to compile large number of files into a single bundle or single file. Webpack 5 is the latest version and was released in the last month. It is still only fully stable.
However, Angular 11 provides experimental support for webpack 5 and you can use it with Angular 11 to try out new things. According to release notes, Angular team believe they can extend this experimental support to achieve faster builds and smaller bundles once things get stable.
Moving to ESLint
TSLint was one of the most popular linting tools among developers for a long period of time. But it was recently deprecated and duties were handed to ESLint.
Angular is also moving from TSLint to ESLint with version 11 update and you won’t be able to use TSLint for linting purposes in Angular again. Angular has introduced a three-step method to migrate from TSLint to ESLint.
Updated Language Service Preview
“The Angular Language Service provides code editors with a way to get completions, errors, hints, and navigation inside Angular templates. It works with external templates in separate HTML files, and also with in-line templates”
Previously, this language service was based on View Engine. Angular 11 provides a new more powerful and accurate Ivy-based language service.
Although this feature is also still in development, it has capability of behaving similiarly to the TypeScript compiler.
Breaking Changes
- Angular 11 removes IE9, 10 and IE mobile support completely.
- TypeScript 3.9 is no longer supported
- preserveQueryParams has been removed in router and queryParamsHandling=”preserve” can be used instead.
- Expressions within ICUs are now type-checked again.
- The async pipe no longer claims to return undefined for an input that was typed as undefined.
