Dynamic Rendering
Was ist Dynamic Rendering und wann ist es eine sinnvolle Lösung für JavaScript-lastige Webseiten?- Was ist Dynamic Rendering?
- Wann Dynamic Rendering einsetzen?
- Wie funktioniert Dynamic Rendering technisch?
- Dynamic Rendering implementieren
- Risiken und Nachteile
- Alternativen zum Dynamic Rendering
Was ist Dynamic Rendering?
Dynamic Rendering ist eine Technik, bei der Webseiten je nach dem anfragenden Client unterschiedliche Versionen ausliefern:
- Für Suchmaschinen-Crawler – Eine vorgerenderte, vollständige HTML-Version
- Für normale Nutzer – Die reguläre JavaScript-basierte Version
Google hat Dynamic Rendering als Übergangslösung für JavaScript-lastige Seiten vorgeschlagen, die nicht kurzfristig auf Server-Side Rendering umgestellt werden können.
Wann Dynamic Rendering einsetzen?
Google empfiehlt Dynamic Rendering ausdrücklich als Übergangslösung, nicht als dauerhaften Ansatz. Es eignet sich für:
- Bestehende JavaScript-Apps, die nicht kurzfristig auf SSR umgestellt werden können
- JavaScript-Inhalte, die indexierungsrelevant sind, aber keine SSR-Infrastruktur vorhanden ist
Dynamic Rendering ist keine Empfehlung für neue Projekte. Diese sollten von Beginn an SSR oder SSG einsetzen.
Wie funktioniert Dynamic Rendering technisch?
Dynamic Rendering benötigt zwei Komponenten:
- User-Agent-Erkennung – Der Server erkennt anhand des User-Agent-Strings, ob die Anfrage von einem Crawler kommt.
- Prerenderer – Ein Prerenderer (z.B. Puppeteer, Rendertron) öffnet die Seite in einem Headless Browser, führt das JavaScript aus und liefert den resultierenden HTML-Quelltext zurück.
Bekannte Googlebot User-Agents: Googlebot/2.1, Googlebot-Image/1.0, APIs-Google
Dynamic Rendering implementieren
Nginx-Konfigurationsbeispiel mit Rendertron:
# Nginx-Konfiguration für Dynamic Rendering
map $http_user_agent $prerender_ua {
default 0;
"~*Googlebot" 1;
"~*bingbot" 1;
"~*Twitterbot" 1;
"~*facebookexternalhit" 1;
}
server {
location / {
if ($prerender_ua = 1) {
# Crawler an Rendertron weiterleiten
proxy_pass http://rendertron-server:3000/render/$scheme://$host$request_uri;
}
# Normale Nutzer: Standard-App ausliefern
try_files $uri /index.html;
}
}
Risiken und Nachteile
- Cloaking-Risiko – Unterschiedliche Inhalte für Bot und Nutzer gelten als Cloaking. Google erlaubt Dynamic Rendering als Ausnahme, solange der Inhalt inhaltlich identisch ist.
- Wartungsaufwand – Ein Prerenderer muss betrieben und gewartet werden.
- Zusätzliche Latenz – Rendering mit Headless Browser ist langsamer als SSR.
- Cache-Management – Prerender-Cache muss bei Inhalts-Updates invalidiert werden.
Alternativen zum Dynamic Rendering
- Server-Side Rendering (SSR) – Die bevorzugte Lösung. Der Server liefert vollständiges HTML für alle Anfragen.
- Static Site Generation (SSG) – Für Seiten mit relativ statischen Inhalten die beste Option.
- Moderne Frameworks – Astro, Next.js und SvelteKit bieten hybride Ansätze, bei denen JavaScript nur dort eingesetzt wird, wo es wirklich benötigt wird.
Weitere Informationen finden Sie auf den Seiten JavaScript SEO, SSR vs. CSR und robots.txt.