Next.js App Router data fetching patterns: fetch, cache, and revalidate
The Next.js App Router rethinks data fetching from the ground up: fetch calls are cached by default, Server Components run on the server with direct database access, and revalidation can be time-based or on-demand. This guide maps every data fetching pattern — static, dynamic, streaming, incremental, and direct database queries — to the right API, explains all four caching layers, and covers the mistakes that cause stale data and unexpected re-renders in production.
nextjsreactapp-routerdata-fetchingcachingserver-componentsperformance
16 July 2026