- Angular 15 is the latest version of the Angular framework at the time of writing this post.
- Released on November 16, 2022.
- The focus is on stability this year.
- node.js versions supported: 14.20.x, 16.13.x, and 18.10.x
- TypeScript version supported: 4.8 or later
- Comes with several new features and improvements that make it easier for developers to build high-performance, scalable web applications, and to take advantage of the latest technologies and platforms.
Let’s see what’s new in Angular 15.
|Stable standalone APIs||– Introduced in Angular 14 and now stable in Angular 15.|
– Allows building apps without using Ng Modules.
– Allows bootstrapping an application in a single component.
– Completely functional with the router, Angular Elements, HttpClient, etc.
– Simplify development and serve as an alternative to NgModules.
– Angular CLI has been updated to support standalone components.
ng g component –standalone
|Directive Composition API||– Gives ability to add directives to host elements for code reusability.|
– Only works with standalone directives.
|Multi-Route Application||– Easily build multi-route applications using standalone APIs.|
– Removes unnecessary features from the router at the build time hence reducing the bundle size.
|Functional Router Guards||– It uses the tree-shakable standalone router APIs and helps smaller Angular’s bundle.|
|Router unwraps default imports||– Automatically unwraps default exports using the feature of lazy loading.|
|Image Directive (NgOptimized Image)||– Automatically generate the SRC set.|
– Reduces the download time of images by image upload with appropriate size.
– ‘fill’ mode as new feature (experimental) which eliminates declaration of image’s width and height as image fill its parent container.
– Standalone NgOptimizedImage can be used directly in a component.
|Better Stack Traces||– Error messages focused on code instead of errors from third-party dependencies.|
– Trace more of a development code than showing libraries it calls.
|Stable MDC-Based Components||– MDC (Material Design Components) now makes it easier to refactor the component-based Angular material.|
|Automatic Language Service Import||– Components used in templates but not added to standalone components or NgModules can be automatically imported by the language service.|
|Extended esbuild Support||– Quicker build time and pipeline simplification.|
– Support of ng build-watch.
|CDK Listbox||– For focus management, keyboard interaction, and bidi layout support.|
– Based on WAI-ARIA listbox pattern.
|Other improvements||– Angular CLI lets you generate a new standalone component.|
– Reduce confguration by removing test.ts, polyfills.ts, and environments.
– Default formatting configuration for DatePipe can be changed globally.
Visit Techtalkbook to find more related topics.