Angular 9 New features

1.Ivy Renderer:  The most significant change in Angular 9 was the introduction of the Ivy rendering engine as the default renderer. Ivy is a new, backward-compatible compilation and rendering pipeline that replaces the older View Engine.

Ivy brings several benefits, including:

• Smaller Bundle Sizes: Ivy offers improved tree-shaking capabilities, which means that unused code is removed from the final bundle, resulting in smaller file sizes. This can significantly reduce the size of the JavaScript bundles delivered to users, leading to faster load times.

• Faster Compilation: Ivy is more efficient in compiling Angular templates and generates faster code compared to the View Engine. This leads to faster application start up times and overall improved performance.

• Improved Debugging and Build Times: Ivy provides better debugging support with enhanced error messages and source maps, making it easier to identify issues during development. Additionally, Ivy's incremental compilation allows for faster rebuilds during development.

 

2. Lazy Loading of Components: Angular 9 introduced the ability to lazy load individual components, allowing developers to optimize application loading times. Lazy loading means that certain components and modules are loaded only when they are required, not during the initial application load. This is particularly useful for large applications where loading everything at once can slow down the initial page load.

Lazy loading can be achieved using the componentFactoryResolver from Angular’s core library or by using Angular’s built-in RouterModule to set up lazy-loaded routes.

3. Optional Strict Mode: Angular 9 introduced strict mode, an optional configuration that enables a more stringent development environment. When strict mode is enabled, the compiler applies stricter type-checking rules, enforces best practices, and catches more errors during development.

With strict mode, developers are encouraged to write cleaner, more robust code and catch potential issues at build time, rather than at runtime. This can lead to more maintainable and stable applications.

4. Improved Internationalization (i18n): Angular 9 made significant improvements to its internationalization (i18n) capabilities, making it easier to create and maintain applications in multiple languages. The i18n extraction and translation process were streamlined and enhanced, allowing developers to generate translated versions of their application more easily.

The improvements in i18n make it more convenient for international teams to collaborate on translating the application's text, ensuring a smoother user experience for users from different language backgrounds.

5. Angular Language Service: The Angular Language Service, introduced in Angular 9, provides better code intelligence and autocompletion for Angular templates within popular code editors like Visual Studio Code.

The language service understands Angular templates and provides intelligent suggestions and hints as you type, helping developers write code faster and with fewer errors.

6. Updated Dependencies: Angular 9 updated several underlying dependencies to their latest versions, including TypeScript 3.7 and RxJS 6.5. Keeping dependencies up to date ensures that Angular applications stay current with the latest features, bug fixes, and performance improvements in the underlying technologies.

7. Router Updates: The router in Angular 9 introduced various improvements and bug fixes, enhancing the overall navigation experience in Angular applications.

In summary, Angular 9 brought significant improvements in performance, build times, and developer experience. It introduced the Ivy renderer as the default, which improved the overall application performance by reducing bundle sizes and enhancing compilation. The update also focused on making Angular applications more maintainable with strict mode, better internationalization support, and improved tooling like the Angular Language Service.