Next.js tips
5 tips · newest first
Next.js App Router tips: caching semantics, Server Components, Server Actions, and streaming — the sharp edges of 15+, one snippet at a time.
Push 'use client' to leaf components and pass server data down as props
NEXTEverything in the App Router is a Server Component until you add 'use client', and that directive taints the whole subt…
Remember GET route handlers are uncached by default since Next.js 15
NEXTNext.js 15 flipped the default: GET route handlers and the client router cache are no longer cached unless you opt in.…
Invalidate exactly what changed with revalidateTag/revalidatePath after writes
NEXTAfter a mutation, invalidate the specific cache entries it affected rather than forcing a broad refresh or client reloa…
Use Server Actions for internal mutations instead of hand-rolled API routes
NEXTServer Actions run mutation logic on the server and can be called directly from a <form action> or a client handler — n…
Stream slow sections with loading.tsx and Suspense instead of blocking the route
NEXTA route-level loading.tsx wraps the page in a Suspense boundary so the shell streams immediately while data loads. Wrap…