Exploring Server Side Rendering

Server-side rendering (SSR) is back in the spotlight—and React is evolving fast. In this workshop, we’ll go deep into the mechanics, performance trade-offs, and modern techniques of SSR with React.js. You’ll start by building an SSR app from scratch — no frameworks, just raw renderToString and hydrateRoot—to truly understand how React renders on the server and hydrates on the client. From there, we’ll upgrade to React 18’s streaming capabilities using renderToPipeableStream, implement selective hydration using Suspense, and integrate data fetching directly into the server render cycle. We’ll look at React Server Components (RSC), showing how they complement SSR. We’ll also cover hydration strategies, how to prevent mismatches, and how to cache or stream HTML effectively for real-world performance. Finally, we’ll bridge our manual SSR work into production frameworks like Next.js.