Next.js app-router critical
Data Fetching Patterns
Server component data fetching with fetch, caching strategies, revalidation patterns, parallel requests, and React cache for optimal performance.
- Difficulty
- intermediate
- Read time
- 1 min read
- Version
- v1.0.0
- Confidence
- established
- Last updated
Quick Reference
In Next.js 15, fetch is NOT cached by default. Use fetch(url, { cache: 'force-cache' }) to cache, or { next: { revalidate: 3600 } } for ISR. Use Promise.all for parallel fetches. Use revalidateTag/revalidatePath in Server Actions for on-demand revalidation. For non-fetch data (DB queries), use React cache() or unstable_cache with tags.
Use When
- Fetching data in Server Components
- Setting up caching strategies
- Implementing ISR (Incremental Static Regeneration)
- Revalidating cached data
Skip When
- Client-side data fetching (use SWR or React Query)
- Using Pages Router (use getServerSideProps)
Data Fetching Patterns
Server component data fetching with fetch, caching strategies, revalidation patterns, parallel requests, and React cache for optimal performance.