Next.js 16 lessons: what we learned shipping 16 sites.

Next.js 16 lessons: what we learned shipping 16 sites.

Next.js 16 is a step up. We have shipped 16 sites on it. Here is what we learned.

What changed.

Turbopack is stable now. React 19.2 is here. The cache model is new. Edge runtime is the default. Server actions are the new way to change data. None of these are small changes.

What worked.

Turbopack.

After 18 months in beta, Turbopack is now stable. We use it on all our work. Cold start is 5 to 10x faster. HMR is under 100ms on most pages. Build time is 30 to 60 percent faster. No blockers so far. One catch: some niche Webpack loaders have no Turbopack twin yet. Check first if you use one.

Edge runtime is now the default.

Middleware runs on the edge. A dynamic page can join in with one line. We run all marketing sites on the edge now. TTFB is under 100ms in most places. Even on a cold cache. See why we build edge AI-first for the rules behind our edge-first approach.

Server actions.

Change data without an API route. Form posts, database writes, calls to other services. They now cover 70 percent of what we used to do with API routes. The code is shorter. The types are safer. TypeScript works across the whole stack.

React 19.2.

The compiler often removes the need for useMemo and useCallback. Server components work the same. Most functions no longer need forwardRef. The use hook replaces some useEffect patterns. Most components need small edits. Not rewrites.

What broke.

When migrating from Next.js 15 to 16, the runtime and rendering changes affect how search engines index your pages. Our JavaScript SEO guide explains how these architectural shifts affect what Googlebot and AI crawlers can index from dynamic routes.

params and searchParams are Promises.

This is the biggest move cost. Every dynamic route must be async. We wrote a codemod that covers 80 percent of the move. The last 20 percent is by hand. Parts that used params the old way need the most work.

Cache is no longer free.

fetch is no longer cached unless you say so. You must set the cache rule. That breaks sites that leaned on the old default. The fix is one line. But you must check every fetch call. Our JavaScript SEO guide covers how cache rules meet search engine crawlers.

React 19.2 is stricter.

useEffect deps are now checked more closely. Strict mode effects run twice in dev. Old class-based parts have new warnings. None of these break your build. You will see new warnings in dev.

When to move.

Move now if you are starting a new project. Move if you have a live project with more than six months of work ahead. Move if you want edge runtime for marketing sites. Move if you want server actions for forms.

Hold off if your site is in upkeep mode. Hold off if you have a key release in the next two weeks. Hold off if your Webpack loader has no Turbopack twin.

The move plan.

Day 1: Update next and react to 16. Day 2: Run the codemod for params and searchParams. Fix the last 20 percent by hand. Day 3: Check every fetch call. Add the cache rules. Day 3: Test in dev mode. Watch for new warnings.

Total: one to three days for most sites. After the move, apply the performance budget playbook to set a JS budget per route and catch drops in CI.

What we build with it.

Marketing sites with edge runtime and ISR. Internal admin pages with server actions. API routes that pass calls out. Headless CMS front ends with on-demand refresh.

That trio is the best web stack we have used.