← all skills

data-fetching

• Web
• knowledge — teaches; changes nothing
• 413 lines
• 4 references

Read data in a Next.js 16 App Router app the canonical way — async Server Components first, URL searchParams for filter state, use() + <Suspense> when a Client Component needs server data, Route Handlers + SWR/React Query only as a last resort. Server Actions are for mutations, never reads. Use when the user is about to load data via a Server Action, about to add useEffect to fetch, about to convert a page to "use client" for filter state, or pastes useState + useEffect + fetch in a Client Component. Also owns Next.js 16 Cache Components — cacheComponents, use cache, cacheLife, revalidateTag, Partial Prefetching, Instant Navigations — and any question about caching, prefetching or navigation speed. Refuses outside Next.js 16 web. Not for: form persistence (forms), local UI state (state-discipline), React Native (rn-data-fetching), or mutations.