Signal-Based Memoization for Derived Object Maps

Snippet

Signal-Based Memoization for Derived Object Maps

Deriving a Map from an array using computed() signals creates a highly efficient lookup cache. Since computed signals are memoized, the Map is only rebuilt when the underlying rawUsers signal emits a new value, optimizing O(1) access patterns in templates.

snippet.js
javascript
const rawUsers = signal([{ id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }]);
const userMap = computed(() => {
  return new Map(rawUsers().map(u => [u.id, u]));
});
 
const getUser = (id: number) => userMap().get(id);

angular

Breakdown

const userMap = computed(() => {

Creates a derived, read-only signal that memoizes the result.

return new Map(rawUsers().map(u => [u.id, u]));

Transforms the array into a Map for constant-time lookups.

Previous snippet Next snippet

More Expert JavaScript exercises →

From your library

Signal-Based Memoization for Derived Object Maps

Related