Fine-grained Update Control with Computed Equality Functions

Snippet

Fine-grained Update Control with Computed Equality Functions

Signals in Angular allow for custom equality functions in 'computed' and 'signal' definitions. By overriding the default identity check, you can prevent unnecessary downstream recomputations when complex objects change but only specific properties matter for the derived state.

snippet.js
javascript
export class UserProfile {
  user = signal({ id: 1, name: 'Max', lastLogin: new Date() });
  
  // Only recompute if the ID changes, ignoring lastLogin updates
  userId = computed(
    () => this.user().id,
    { equal: (a, b) => a === b }
  );
 
  constructor() {
    effect(() => console.log('User ID updated:', this.userId()));
  }
}

angular

Breakdown

computed(() => this.user().id, { equal: ... })

Defines a derived signal with a custom comparison strategy.

equal: (a, b) => a === b

Explicitly tells the signal to only notify consumers if the primitive value differs.

effect(() => ...)

This block will only trigger if the 'equal' check returns false.

Previous snippet Next snippet

More Expert JavaScript exercises →

From your library

Fine-grained Update Control with Computed Equality Functions

Related