SSR, SSG oder ISR für jede Route einer Next.js-App wählen
Lege für jede Route deines Next.js-Projekts die Rendering- und Caching-Strategie fest (statisch, ISR, dynamisch, Streaming, Client) mit begründeter Tabelle, Beispielcode und Prüfweg. Entwickelt für ChatGPT, Claude, Gemini und Microsoft Copilot. Er enthält 4 anpassbare Variablen und lässt sich kostenlos mit einem Klick kopieren.
Experte · Text · Redaktionelle Prüfung ausstehend
Prompt
Arbeite als Architekt mit Schwerpunkt auf dem Next.js App Router, Web-Performance und technischem SEO.
Kontext:
- Projekt: {{projekt}}
- Routen und Aktualität der Daten: {{routen}}
- Hosting: {{hosting}}
- Next.js-Version: {{next_version}}
Fehlen entscheidende Informationen (welche Routen von der Nutzersitzung abhängen, wie oft sich Daten ändern, ob Inhalte aus einem CMS mit Webhooks kommen), frag nach, bevor du entscheidest.
Liefere:
1. Eine Tabelle pro Route: Strategie (statisch beim Build, statisch mit zeitbasierter oder bedarfsgesteuerter Revalidierung, dynamisch pro Request, Streaming mit Suspense, clientseitiges Laden), Begründung, Datenquelle, Auswirkung auf SEO und Time to First Byte.
2. Wie Inhalte jeweils invalidiert werden (zeitbasiert, revalidatePath oder revalidateTag aus einem Webhook) und was passiert, wenn die Revalidierung fehlschlägt.
3. Was eine Route ungewollt dynamisch macht (Cookies, Header, Suchparameter, ungecachte fetch-Aufrufe) und wie man den personalisierten Teil isoliert, damit der Rest statisch bleibt.
4. Kurzen Beispielcode für zwei bis drei repräsentative Routen.
5. Einschränkungen von {{hosting}}, die die Entscheidung beeinflussen (etwa: Ein statischer Export kann nicht pro Request rendern).
6. Prüfweg: was die Ausgabe von `next build` je Route zeigt und welche Cache-Header in Produktion zu kontrollieren sind.
Vorgaben:
- Das Standard-Caching hat sich zwischen Next.js-Versionen geändert: Nenne deine Annahme für {{next_version}} und empfiehl den Abgleich mit der offiziellen Dokumentation dieser Version.
- Erfinde keine Performance-Kennzahlen; Schätzungen kennzeichnest du als solche.
- Bevorzuge statisch, wann immer die Aktualitätsanforderungen es erlauben.
Format: Haupttabelle, kurze Abschnitte je Thema und eine abschließende Risikoliste.So verwenden Sie ihn
- Liste deine echten Routen mit Änderungshäufigkeit und Nutzerbezug auf. 2. Nenne Hosting und genaue Next.js-Version. 3. Setze die Tabelle um und prüfe vor dem Release die Ausgabe von next build.
Anwendungsbeispiel
Projekt: Möbelshop mit Blog · Routen: /, /produkte/[slug] (Preise ändern sich täglich), /blog/[slug], /konto (privat) · Hosting: Vercel · Version: Next.js 15.
Beispielergebnis
Annahme: Next.js 15, in dem fetch nicht mehr standardmäßig gecacht wird. Prüfen Sie die offizielle Dokumentation Ihrer Version.
Strategie pro Route
| Route | Strategie | Grund | Invalidierung |
|---|---|---|---|
/ | Statisch mit Revalidierung | Ändert sich wöchentlich | revalidateTag('home') aus dem CMS |
/produkte/[slug] | Statisch + ISR; Preis und Bestand in einem Suspense-Block | SEO braucht schnelles HTML; Bestand ändert sich täglich | revalidateTag('produkt:slug') bei Bestandsänderung |
/blog/[slug] | Statisch mit generateStaticParams | Ändert sich selten | revalidatePath per CMS-Webhook |
/konto | Dynamisch pro Request | Privat, pro Nutzer; liest Cookies | Kein Cache |
Was eine Route versehentlich dynamisch macht
cookies()oderheaders()in einem gemeinsamen Layout lesen: Das zieht alle Unterrouten mit.searchParamsauf der Produktseite für einen Nebenfilter nutzen.
Lösung: Den personalisierten Teil (Warenkorb, Begrüßung) in eine Client-Komponente oder einen Suspense-Block auslagern, damit der Rest statisch bleibt.
Prüfen
In der Ausgabe von next build ist jede Route als statisch (○), SSG (●) oder dynamisch (ƒ) markiert. Steht /produkte/[slug] auf ƒ, liest etwas Request-Daten …
Wichtige Fakten
- Kategorie
- Programmierung & Entwicklung · Next.js
- Ausgabetyp
- Text
- Niveau
- Experte
- Entwickelt für
- ChatGPT, Claude, Gemini und Microsoft Copilot
- Verifiziert in
- Redaktionelle Prüfung ausstehend
- Variablen
- Projekt, Routen und Datenaktualität, Hosting und Next.js-Version
- Sprache
- Deutsch
- Preis
- Kostenlos, ohne Anmeldung
- Aktualisiert
- 07.11.2026
Häufig gestellte Fragen
Was ist der Unterschied zwischen SSG und ISR?
Bei SSG entsteht die Seite beim Build und bleibt bis zum nächsten Deployment gleich. Bei ISR wird sie statisch ausgeliefert, aber nach einem Intervall oder auf Anforderung neu erzeugt, ohne neues Deployment.
Ist Server-Rendering immer besser für SEO?
Für SEO zählt, dass das initiale HTML den Inhalt enthält. Eine statische oder ISR-Seite schafft das genauso wie SSR und ist meist schneller und günstiger auszuliefern.
Warum wird eine Route ungewollt dynamisch?
Meist, weil sie Cookies, Header oder Suchparameter liest oder ein ungecachtes fetch ausführt. Der Prompt hilft dir, diese Aufrufe zu finden und zu isolieren.
Wofür ist dieser Prompt gedacht?
Lege für jede Route deines Next.js-Projekts die Rendering- und Caching-Strategie fest (statisch, ISR, dynamisch, Streaming, Client) mit begründeter Tabelle, Beispielcode und Prüfweg.
Mit welchen KI-Tools funktioniert er?
Er ist für ChatGPT, Claude, Gemini und Microsoft Copilot entwickelt. Wir haben ihn in diesen Tools noch nicht überprüft, daher können die Ergebnisse variieren.
Wie passe ich den Prompt an?
Klicken Sie auf „Anpassen“ und füllen Sie die Variablen aus (Projekt, Routen und Datenaktualität, Hosting und Next.js-Version). Der Text wird sofort aktualisiert und lässt sich anschließend mit einem Klick kopieren. Die Werte werden nur in Ihrem Browser gespeichert.
Brauche ich Erfahrung, um ihn zu verwenden?
Er ist für Experten: Er richtet sich an Personen mit Erfahrung im Thema, die das Ergebnis beurteilen und anpassen können.
Ist dieser Prompt kostenlos?
Ja. Jeder Prompt von HomeCasa Prompts ist kostenlos, ohne Anmeldung und ohne Abonnement. Sie können ihn auch in beruflichen Projekten verwenden.
Kann ich der KI-Ausgabe vertrauen?
Betrachten Sie sie als hochwertigen Entwurf: Prüfen Sie Daten, Zahlen und wichtige Aussagen immer, bevor Sie etwas veröffentlichen oder Entscheidungen treffen.