Everything so far has assumed the same starting point: the browser downloads an empty <div id="root">, then your JavaScript, and then React 7,897 builds the page. For a dashboard behind a login that is the right answer. For a public catalog it is a liability — the first paint waits on a bundle, and the text that search engines and link previews want is not in the document they fetch.
Server rendering moves the first render to Node. The server calls your components, turns the resulting element tree into HTML, and sends that HTML in the response; the browser paints it immediately and then hydrates it, attaching the event handlers that make it interactive. React Server Components go further and let some components run only on the server, never shipping their code or their dependencies to the browser at all.
This section shows both from the bottom: a hand-rolled server, the streaming API that replaced renderToString, the static prerender that produces files for a CDN, and the model behind Server Components. Frameworks own this layer in practice, but they call exactly these functions, and Next.js puts the practical version to work in Next.js 10,514 .