Next.js 16 + React 19: Turbopack, Server Components, and Streaming SSR

Next.js 16 is the first release where React Server Components are not a feature you opt into — they are the assumed baseline. Turbopack is the default bundler, and the dev-server experience is markedly faster, especially on large apps where Webpack cold starts had become painful.

RSC as the default

The mental shift: most components are server components. You reach for "use client" deliberately, at the leaves — the interactive bits. State, effects, and event handlers live there; data fetching, formatting, and heavy dependencies stay on the server and never ship to the browser.

The payoff is concrete: a 3D portfolio that used to ship ~600KB of Three.js on first paint can keep that bundle behind a dynamic(() => import(...), { ssr: false }) boundary, so the initial HTML is light and the heavy scene hydrates only when it scrolls into view.

Streaming with Suspense

Streaming SSR means the shell renders immediately and each data-bound section streams in as it resolves. Wrap slow regions in <Suspense> and the page is usable before every query finishes. The trick is choosing boundaries at meaningful units — a "metrics" card, a "projects" grid — not at every single component.

Metadata is server-side

A common mistake is putting generateMetadata in a client component. It does not run there. Keep the page as a server component, do the fetch there, and delegate rendering to a PageClient child. This is what lets dynamic <title>, Open Graph tags, and JSON-LD land in the initial HTML — which matters for SEO and link previews on blog and project pages.

What to watch

Turbopack is fast but occasionally opinionated about loaders. If a legacy Webpack config was doing something exotic, expect a small migration. For greenfield apps, there is no reason to reach for Webpack at all anymore.