Angular v22: Signals, OnPush Default, AI Tools Arrive

Angular's Signal Revolution and AI Integration

Angular v22 marks a pivotal release, particularly with the default adoption of OnPush change detection and the stabilization of Signal Forms. This shift towards a more declarative and signal-based programming model is a significant step for Angular, aligning it with modern reactivity patterns and promising improved performance and developer experience. The stabilization of Signal Forms, especially with support for Angular Material and Aria, addresses a long-standing need for a more ergonomic and type-safe approach to form management, moving away from the complexities often associated with RxJS for this purpose. The experimental WebMCP support and related AI tooling are forward-looking, aiming to integrate Angular's capabilities with emerging AI coding agents, which could drastically alter development workflows in the future.

However, the article also highlights potential friction points. The decision to make OnPush the default, while beneficial for performance, necessitates a migration strategy for existing applications that relied on the previous 'Eager' behavior. The deprecation of Webpack support and the move towards Fetch by default for the HTTP client, while modernizing the stack, will require developers to adapt their build processes and potentially refactor network calls. Furthermore, the criticism regarding the compiler hindering AI code generation and the difficulty of integrating custom toolchains like Vite suggests that Angular's ecosystem might still present challenges for those seeking maximum flexibility or aiming to leverage cutting-edge build tools. The removal of Node 20 support also means developers must ensure compatibility with newer Node.js versions.

Despite these challenges, the overall direction of Angular v22 is promising. The focus on developer ergonomics through signal-based APIs and template enhancements, coupled with the strategic push towards AI integration, positions Angular for continued relevance. Developers who adopt these new patterns early will likely benefit from improved performance, maintainability, and a more streamlined development experience, especially when building complex, data-intensive applications. The success of the AI tooling will depend heavily on its adoption and the ecosystem's ability to build upon it.

Key Points

• Angular v22 stabilizes Signal Forms, offering a declarative, signal-based API that merges reactive and template-driven form ergonomics.
• OnPush change detection is now the default for components, replacing the previous 'Eager' strategy, which aims to improve performance.
• Experimental WebMCP support is introduced, exposing Angular and Signal Forms tools to in-browser AI coding agents.
• New features for dependency injection include the @Service() decorator and lazy loading with injectAsync.
• Template enhancements include spread/rest syntax, multiple case matching in @switch, and inline arrow functions.
• Webpack support is deprecated, signaling a move towards more modern build tooling, with Fetch being the default for the HTTP client.
• Angular v22 requires TypeScript 6 and drops Node 20 support, with automatic schematics for migration.
• Manual migration steps are required for paramsInheritanceStrategy and the deprecation of Webpack.

---

📖 Source: Google Releases Angular v22 with Stable Signal Forms, OnPush by Default and Experimental WebMCP