Angular 21.2: Resource Composition via Snapshots

A deep dive into Angular's new snapshot-based pattern for transforming and composing resources without losing their interface.

TL;DR

Angular added three things that let you take a resource, modify its behavior, and get back a real resource.

Resource  →  .snapshot  →  transform it  →  resourceFromSnapshots()  →  Resource

The killer use case? Keep showing old data while new data loads — no more blank screens when switching between items. And it’s a generic utility you write once and reuse everywhere.

PR: feat(core): resource composition via snapshots
Authors: Alex Rickabaugh & Jessica Janiuk
Status: Experimental · Angular 21.2+

Code Repository Example in this article can be found here.

The Problem (in Plain English)

Imagine you have a weather app. The user is looking at London’s weather. They click “Tokyo.” What happens?

Before this PR:

1. The resource enters “loading” state

2. value() immediately becomes undefined

3. The weather card disappears — blank screen, skeleton loader

4. Tokyo’s data arrives, card re-appears

That flash of empty content feels broken. Users hate it.

You might think: “I’ll just keep the old value around in a separate signal.” Sure, but then you lose the Resource interface. Your workaround doesn’t have .isLoading(), .hasValue(), .status(). It’s a one-off hack that doesn’t compose.

The real problem: there was no way to take a Resource, tweak its behavior, and get back something that’s still a Resource.