Rendering & Caching
SSR, static vs dynamic, the cache that won't invalidate, and hydration mismatches.
13 articles
Next.js Hydration Failed: Find the Real Mismatch, Not the Suppress Flag
Hydration failed and the overlay will not say which element. Here is the diff technique that finds it, the five real causes, and why suppressHydrationWarning is not a fix.
Dynamic Code Evaluation Not Allowed in Edge Runtime: The Next.js Middleware Fix
Mongoose and jsonwebtoken break Next.js middleware with a dynamic code evaluation error that names no package. Here is the real cause and the fix for each version.
DynamicServerError: Every Way Next.js Opts a Route Out of Static Rendering
The App Router prerenders every route until one request-time API bails the whole thing. Here is the complete trigger list, what changed in 15 and 16, and the real fix.
export const revalidate Is Ignored in Production: How to Find Out Why
Your Next.js revalidate export works with next start but the production page never updates. Here is how to tell which of the four caches is actually lying to you.
suppressHydrationWarning Isn't Cosmetic: It Freezes the Server Value
suppressHydrationWarning stops React patching mismatched text, so localized dates stay stuck at the server value forever. The mechanism, and the two-pass render that fixes it.
Turbopack 'Cannot Find Module' With Pino and Dynamic requires
Next.js 16 made Turbopack the default bundler and packages that resolve module paths at runtime started breaking. Here is the mechanism and the correct fix, not just the flag.
searchParams Is Empty in Production but Works in next dev: the Static Rendering Contract
Your page reads searchParams fine in next dev, then ships to production with empty query params or a Dynamic server usage build error. It is the static/dynamic rendering contract, not a bug.
Vite '504 Outdated Optimize Dep' Explained: The Dependency Cache Race You Cannot Fully Avoid
Vite's 504 Outdated Optimize Dep is a version-hash cache race in dependency pre-bundling, not a network error. Here is the unstick, the optimizeDeps.include fix, and its limits.
next/script beforeInteractive breaks hydration in App Router layouts
A beforeInteractive script runs before React hydrates. If it touches <html> or <body>, the server and client markup no longer match and you get a hydration error. Here is the real fix.
Next.js Hydration Mismatches That Are Not Your Fault: Turbopack and Edge Causes
Every hydration article blames Date.now() and browser extensions. When the mismatch is a color-scheme attribute or a path that resolves differently on Vercel Edge, that advice is useless.
revalidateTag() Not Invalidating Cache? The Debugging Checklist
revalidateTag returns fine but the data stays stale. Here is the four-step checklist: tag every fetch, match strings exactly, and see what is actually cached.
revalidate = 0 Isn't Stopping Next.js From Caching Your Supabase Data
revalidate = 0 tunes the Data Cache, but Supabase data is frozen in the Full Route Cache from static rendering. Force the route dynamic instead. Here is the real fix.
next/dynamic Named Imports Cause Hydration Errors: The Real Fix
That hydration error from a dynamically imported library is often an import bug in disguise. Why named exports resolve to undefined, and the .then() plus client-wrapper fix.