What is Streaming SSR and how does it improve perceived performance?

Streaming SSR uses HTTP chunked transfer encoding to flush HTML to the browser incrementally rather than waiting for the entire page to render server-side.

How it works (React 18 + Next.js App Router):

1. Server sends the HTML shell immediately (nav, layout, static content).
2. Slow data-fetching components are wrapped in <Suspense> with a fallback (skeleton).
3. As each suspended boundary resolves, React streams the HTML chunk followed by an inline <script> that replaces the placeholder.

// app/page.tsx
export default function Page() {
  return (
    <Layout>
      <HeroBanner /> {/* static, streams immediately */}
      <Suspense fallback={<Skeleton />}>
        <RecommendationFeed /> {/* slow DB query, streams when ready */}
      </Suspense>
    </Layout>
  );
}

Performance benefit: TTFB is fast (shell), FCP is fast (visible content), and Time to Interactive is not blocked by the slowest data fetch on the page.