Selector recomputation in createSelector with OnPush change detection
0 reputation · 26 May 2021, 15:00 UTC
In an Angular application using @ngrx/store, a selector created via createSelector is intended to memoize results to prevent unnecessary downstream computations and component re-renders. However, the default memoization mechanism relies on reference equality (===) for its input arguments.
When reducers return new object references—even if the underlying data remains identical—the selector fails to recognize the state as unchanged. In components utilizing ChangeDetectionStrategy.OnPush, this behavior triggers a re-render because the selector emits a new value, bypassing the performance benefits of memoization.
While memoizeOptions was introduced in v12 to allow custom equality checks, there is a trade-off between the overhead of deep comparison and the cost of selector re-execution.
- How can the
memoizeOptionsparameter be implemented to balance deep equality checks against the performance cost of re-rendering large component trees? - What is the recommended strategy for maintaining stable references in normalized state to ensure
createSelectormemoization remains effective without custom equality functions?