Client-Side Rendering (CSR)

Client-Side Rendering (CSR)With Client-Side Rendering (CSR), the server delivers only a nearly empty HTML shell. The actual content is generated in the browser by JavaScript.Open glossary entry → means the server delivers just a shell, often only an empty container such as <div id="app"></div> plus a script. The visible page only appears once the browser loads and executes the JavaScript and fetches data from application programming interfaces (APIAn application programming interface (API) is an interface through which software systems communicate and exchange data. It defines how requests are made and answered.Open glossary entry →).

For users this can work perfectly. For search engine optimisationSearch Engine Optimization (SEO) covers all measures that help a website become more visible in unpaid (organic) search results.Open glossary entry → and AI visibilityAI Visibility describes whether and how visible a brand, website or person is in AI-generated answers. It measures mention, position, description and source linking across multiple platforms and prompts.Open glossary entry →, however, pure CSR is risky because crawlers initially receive only the near-empty shell.

CSR is especially problematic when these elements are created client-side only:

• heading (H1The H1 is a web page's main heading. It names the central topic, is visible to users and should generally appear only once per page.Open glossary entry →) and main text,
• internal linksInternal linking refers to links that connect pages within the same website. They control how search engines and users find and thematically classify content.Open glossary entry → and navigation,
• title, meta descriptionThe meta description is an HTML element in the page <head> that briefly summarises the page's content. Google can display it as the description in the search result.Open glossary entry → and canonical,
• structured dataSchema markup is code that describes a page's content in a structured way, so search engines understand it not just as text but as clearly classified information.Open glossary entry →,
• product data, prices or availability.

More robust alternatives are server-side renderingJavaScript rendering is the process by which a browser or crawler executes JavaScript code to build the final, visible page. Content that is not already in the delivered HTML only appears after this step.Open glossary entry →, static site generation or clean prerendering.