NgRx 22: Resource Extensions and Dynamic Deep Signals for Angular
NgRx 22 adds experimental resource extensions that change Angular's resource behavior, so value() is retained during reloads and no longer throws on errors. It also introduces dynamic deep signals for union types, a SignalStoreFeatureType utility, and ESLint v10 support. Upgrading requires Angular 22 and TypeScript 6.0, and most breaking changes have automated migrations. By Daniel Curtis
Nx Angular state management framework NgRx has released version 22, introducing several enhancements for customizing Angular's resource API, managing union types, and improving ESLint compatibility. The primary new feature, resource extensions, allows developers to patch specific behaviors of existing resources without altering the original resource type. Four built-in extensions are included, and a provideResourceExtensions function can register defaults at various levels.
Resource extensions aim to preserve the original resource type while modifying error handling and other behaviours. This change is crucial for deeper SignalStore integration, as it prevents subsequent patchState calls from throwing errors when the resource is in an error state.
Another significant addition is dynamic deep signals, which provides a more granular approach to managing union types. Previously, a state slice typed as a union would collapse into a single flat Signal, but now each object literal member gets its own DeepSignal. This change allows for more precise state management and improved developer experience.
SignalStore has also been given a new typing helper, SignalStoreFeatureType, which facilitates the reuse of feature state and members as input types for custom features. This eliminates the need for manual redeclaration of feature types.
Additionally, NgRx Toolkit's withResource has supported non-throwing undefined value and previous value handling for SignalStore since version 20.6.0. The new version also brings improvements to the NgRx store-devtools, adding an actionCreators option for dispatching from Redux DevTools. The ESLint plugin has also updated to support ESLint v10, dropping support for ESLint v8 and the legacy .eslintrc format.
The documentation site has received a new light theme, catering to the developers' preferences. To upgrade to NgRx 22, developers need Angular 22, TypeScript 6.0, and RxJS ^6.5 or ^7.5. The update can be performed using ng update commands for @ngrx/store and @ngrx/signals. Most breaking changes have automated migration guides, provided in the v22 migration guide and changelog.
Angular 22 has introduced some breaking changes, including changes to resource timing. Some developers have reported test failures following the upgrade, which have been documented in Angular's release notes. Overall, the community response to Angular v22 has been positive, with many praising the improved developer experience and reduced boilerplate.
Written by urgent.news from InfoQ's reporting — not their text. Machine-written — may contain errors; check the original before relying on it.
