Hvad er client-side rendering (CSR)

Client-side rendering (CSR)

Hvad er client-side rendering (CSR)

Hvad er Client-side rendering (CSR)?

Client-side rendering (CSR) er en metode, hvor indholdet på en hjemmeside genereres i brugerens browser ved hjælp af JavaScript, frem for at blive sendt færdigbyttet fra serveren. Det betyder, at browseren henter en grundlæggende HTML-side samt scripts, som så bygger og viser resten af indholdet dynamisk. CSR bruges ofte i moderne webapplikationer, hvor interaktive brugeroplevelser prioriteres.

Hvornår bruges det?

CSR anvendes typisk på websites eller webapplikationer med mange interaktive elementer, såsom single-page applications (SPA), hvor siden ikke genindlæses, hver gang brugeren navigerer. Dette kan give en hurtigere og mere app-lignende brugeroplevelse. For SEO kan CSR dog betyde, at søgemaskiner har sværere ved at læse og indeksere indhold, fordi det først genereres efter at JavaScript er kørt.

Eksempel: En e-commerce platform benytter client-side rendering for at tillade brugere at filtrere produkter uden, at hele siden genindlæses. Når brugeren vælger et filter, hentes og vises de relevante produkter direkte i browseren gennem JavaScript.

Typiske fejl

  • Overser, at visse søgemaskiner ikke altid kan indeksere JavaScript-genereret indhold korrekt.
  • Mangler fallback-indhold (server-side rendering eller pre-rendering) for vigtige sider.
  • Tester kun brugeroplevelsen, men ikke hvordan siderne vises i Google Search Console eller med ”Fetch as Google”.

Relaterede begreber: Server-side rendering (SSR), pre-rendering, single-page application (SPA)

Picture of Daniel Guldberg Andersen

Daniel Guldberg Andersen

Jeg har arbejdet med SEO siden 2008 og har fulgt faget tæt nok til at vide, hvad der virker — og hvad der mest larmer. Jeg kombinerer teknisk dybde med strategisk forståelse af både SEO, og andre marketing discipliner samt forretningsforståelse. Mine samarbejder bygger på faglighed, ordentlighed og klar kommunikation, og jeg trives bedst, i samarbejder hvor vi spiller hinanden gode og løfter sammen mod et fælles mål.

-Din ambition - Min ekspertise
Sammen skaber vi succes