Q74: How does the Dynamic I/O flag (experimental.dynamicIO) operate in Next.js 15?
Next.js 15 introduced experimental.dynamicIO. It fundamentally changes how static vs dynamic code is evaluated by requiring explicit use cache directives for cached data functions. Any uncached fetch or dynamic data access (cookies(), headers()) executed outside a use cache block automatically marks that data operation as dynamic without requiring route-level overrides.
Granular Function Caching with 'use cache'
// Next.js 15 Dynamic I/O pattern
async function getCachedProducts() {
'use cache'; // Granular function-level caching directive
return await db.products.findMany();
}
export default async function Page() {
const products = await getCachedProducts();
return <div>Products: {products.length}</div>;
}💡 The 'use cache' directive enables fine-grained function-level caching under the Next.js 15 Dynamic I/O architecture.
Key Takeaways
- Introduces explicit
use cachedirectives for granular function-level caching. - Separates code execution from route-level dynamic config flags.
Knowledge Check
What new directive was introduced alongside Next.js 15 Dynamic I/O to mark specific async functions for caching?