0Pricing
React Academy · Lesson

Streaming SSR from the Edge

Stream React's HTML output using ReadableStream so the browser can paint meaningful content immediately.

The Streaming Advantage

When a server streams HTML, the browser receives and renders content in chunks rather than waiting for the complete document. This means users see and interact with the visible parts of the page — the header, navigation, hero section — while slower data-dependent sections are still loading.

renderToReadableStream with bootstrapScripts

Passing bootstrapScripts to renderToReadableStream tells React where the client-side JS bundle lives. React injects a script tag at the end of the stream so the browser loads the bundle and calls hydrateRoot, making the page interactive as each section finishes streaming.

All lessons in this course

  1. What Is Edge Rendering and Why It Matters
  2. React on Cloudflare Workers with Hono
  3. Streaming SSR from the Edge
  4. Edge Caching Strategies for React Apps
← Back to React Academy