How does React Server Components payload work?

React Server Components use a special RSC payload format for client-server communication that differs from traditional SSR HTML streaming. RSC Payload format: a custom binary/JSON streaming protocol. Not HTML — it describes the component tree as serialized React elements, component boundaries, and references. Contains: rendered output of Server Components (JSON-like), placeholders for Client Component boundaries (with their props), references to Client Component module chunks to load. Two distinct operations: (1) HTML streaming (initial load): for the first request, Next.js streams HTML for fast First Contentful Paint + the RSC payload in script tags for hydration; (2) RSC payload only (navigation): for client-side navigation, Next.js fetches only the RSC payload (not full HTML) — the payload updates only the changed route segment, preserving client state in unchanged segments. Why RSC payload instead of HTML for navigation? HTML re-creates the entire DOM (loses state). RSC payload lets React reconcile — preserve Client Component state while updating Server Component output. Client Components in RSC: when a Server Component renders a Client Component, the RSC payload includes: component module reference, props (serialized — must be serializable), a slot for the Client Component's rendering (which happens client-side). Boundaries: Server-to-client boundary: Server Component renders <ClientComp prop={data}/> — data is serialized into RSC payload as props. The Client Component renders with those props on the client.