What is streaming in Next.js, and how does it improve the user experience?

Streaming lets Next.js send parts of a page to the browser as soon as they are ready, instead of waiting for every piece of data on the page to finish loading first. This means fast parts of a page, like the header, can appear immediately, while slower parts load in and appear a moment later.

// app/page.js
import { Suspense } from 'react';

export default function Page() {
  return (
    <div>
      <Header />
      <Suspense fallback={<p>Loading comments...</p>}>
        <Comments />
      </Suspense>
    </div>
  );
}