Server-Side Rendering
A rendering strategy in which the server generates a page's full HTML on each request, rather than leaving the browser to build it with client-side JavaScript.
Definition
Server-side rendering (SSR) is the practice of producing a page's HTML on the server in response to each request, so the browser receives a fully rendered document instead of an empty shell that JavaScript has to populate.
SSR sits on a spectrum that includes static rendering, client-side rendering and hydration. It usually delivers a faster First Contentful Paint and a more reliable experience for crawlers and low-powered devices because the meaningful content arrives in the initial HTML. The trade-off is a potentially slower Time to First Byte and more server load, since the page must be assembled on every request rather than served from a pre-built file.
Examples
Next.js article page
A news site uses Next.js `getServerSideProps` to render each article on the server, so Googlebot and the user both receive a fully populated HTML document containing the headline, body and metadata on the first response.
Switching from CSR to SSR for a JS app
A React app migrates from client-side rendering to SSR after Search Console shows pages indexed without their main content. With SSR enabled, Google's URL Inspection tool now sees the rendered article copy in the source HTML.
Sources
Related terms
- JavaScript SEOThe practice of making JavaScript-powered websites crawlable, renderable and indexable by search engines.
- Dynamic RenderingServing a pre-rendered HTML version of a page to crawlers while delivering a client-rendered version to human visitors of the same URL.
- First Contentful PaintA web performance metric measuring the time from page load start to the first visible text, image, or non-blank canvas being rendered.
- Time to First ByteA performance metric measuring the time between a request for a page and the first byte of the response arriving back at the browser.
- Largest Contentful PaintA Core Web Vitals metric measuring how long the largest visible content element on a page takes to render after loading begins.
- IndexingThe process by which a search engine analyses a fetched page and stores information about it so the page can later be returned in search results.
Where QueryCatch uses this
Last updated: 12/05/2026