Next.js applications of today struggle with an architectural contradiction: entire routes must be either fully static or fully dynamic, forcing developers to sacrifice performance for freshness or vice versa. This all or nothing approach leads to redundant computation, increased costs, and slower user experiences.
In this session, we'll explore Cache Components — an experimental Next.js feature that introduces function-level caching through the `'use cache'` directive. Building on React's streaming capabilities and Partial Prerendering infrastructure, we'll demonstrate how to achieve granular control over what gets precomputed into static shells versus what streams dynamically. You'll learn practical patterns for common scenarios like expensive computations, real-time data requirements, and the sophisticated middle ground between them. We'll examine production migrations showing improved compute cost reductions and reduced Time to First Byte from global edge locations.
You'll leave with a new mental model for caching—not as a performance afterthought, but as a first-class architectural decision that lives alongside your components. Instead of choosing between "static" or "dynamic" routes, you'll understand how to compose cached and streaming content within the same component tree, creating applications that are both performant and architecturally honest about their data requirements.
This talk has been presented at React Advanced 2025, check out the latest edition of this React Conference.