Next.js vs. React ist keine Wahl zwischen zwei Rivalen: React ist eine JavaScript-Bibliothek für Benutzeroberflächen, und Next.js ist ein Framework auf Basis von React, das Routing, Server-Rendering und alles Weitere ergänzt, was eine vollständige Website braucht. Für eine Unternehmenswebsite, die ranken und schnell laden muss, ist reines React, das nur im Browser rendert, selten die richtige Basis, Next.js meist schon, und für viele Marketing-Websites passt ein Content-Management-System wie WordPress besser als beides. Dieser Leitfaden erklärt den Unterschied, die Rendering-Modi, die Folgen für SEO, Performance und Hosting und gibt Ihnen eine Entscheidungshilfe, der Sie folgen können.
Zuletzt aktualisiert: 21. Oktober 2026.
Ist Next.js dasselbe wie React?
Nein. React ist eine Bibliothek: Sie liefert Komponenten, State und eine Art zu beschreiben, was der Bildschirm zeigen soll, und überlässt alles andere Ihnen. Die React-Dokumentation selbst empfiehlt, eine neue App mit einem Framework zu beginnen statt mit React allein, und nennt Next.js unter ihnen.
Next.js ist ein Framework: Es nutzt React für die Oberfläche und ergänzt die Teile, die eine Website darum herum braucht. Das sind dateibasiertes Routing (jede Seite ist eine Datei), Rendering auf dem Server oder beim Build, Datenabruf, Bildverarbeitung, Metadaten für Suchmaschinen und ein Produktions-Build. Wer eine Next.js-Website schreibt, schreibt React; er beginnt nur nicht in einem leeren Raum.
So lässt es sich der Geschäftsführung oder der Marketingleitung erklären: React ist der Motor, Next.js ist ein Auto, das um diesen Motor gebaut ist. Die Frage „Next.js oder React?“ lautet eigentlich: „Wollen wir das Auto selbst bauen?“
Bei Odduel, einer Agentur für Kreation und Technologie in Barcelona und São Paulo, kommt diese Frage in den meisten Projekten für Webdesign und Webentwicklung früh auf, meist weil ein Entwickler das eine vorgeschlagen und jemand auf Kundenseite über das andere gelesen hat. Die Antwort hängt weniger von der Technologie ab als davon, was die Website leisten muss und wer sie bearbeitet.
Kurz gesagt: React allein ist ein Baustein, keine Website. Next.js ist einer der meistgenutzten Wege, aus diesem Baustein eine Website zu machen, die Suchmaschinen lesen und Besucher schnell laden können. Eine Unternehmenswebsite, die vor allem aus Seiten und Artikeln besteht, braucht vielleicht keines von beiden. Der Rest dieses Leitfadens zeigt, wie Sie erkennen, welcher Fall bei Ihnen vorliegt.
Was bringt beides von Haus aus mit?
Der Unterschied wird am klarsten, wenn Sie auflisten, was Sie am ersten Tag bekommen.
React allein
Mit React allein bekommen Sie Komponenten und die Regeln, nach denen sie sich aktualisieren. Den Rest wählen, installieren und pflegen Sie selbst: einen Router, ein Build-Tool, einen Weg zum Datenabruf, einen Weg, Seitentitel und Beschreibungen zu setzen, und bei Bedarf einen Server, der Seiten rendert, bevor sie den Browser erreichen. Jede Wahl ist für sich vernünftig; zusammen werden sie zu einem Stack, der Ihrem Team gehört und den es aktuell halten muss.
Diese Freiheit passt zu einer Anwendung hinter einem Login, etwa einem Dashboard oder einem internen Tool, wo Suchmaschinen nie hinschauen und jeder Nutzer mit bereits geladener App ankommt.
Next.js
Mit Next.js sind diese Entscheidungen auf eine stimmige Weise getroffen. Seiten und ihre Adressen ergeben sich aus der Ordnerstruktur. Jede Seite lässt sich auf dem Server rendern, vorab als statisches HTML bauen oder in festen Abständen im Hintergrund neu erzeugen. Titel, Beschreibungen und Daten für Social-Media-Vorschauen haben ihren eigenen Platz. Bilder werden skaliert und in modernen Formaten ausgeliefert. Es gibt einen Build und einen Weg zum Deployment.
Der Preis: Sie übernehmen die Konventionen des Frameworks und sein Änderungstempo. Next.js hat erhebliche Umbrüche hinter sich, etwa den Wechsel vom Pages Router zum App Router und zu React Server Components, und ein Team muss Zeit einplanen, um ihnen zu folgen.
Wie funktionieren die Rendering-Modi?
Das Rendering entscheidet, wo und wann das HTML einer Seite entsteht. Es ist die wichtigste technische Entscheidung für eine Unternehmenswebsite, denn es bestimmt, was eine Suchmaschine und ein Erstbesucher in der ersten Sekunde sehen.
Clientseitiges Rendering
Der Server schickt eine fast leere Seite und ein Paket JavaScript. Der Browser lädt das Skript herunter und führt es aus, und erst das baut die Seite auf. So funktioniert eine einfache React-App standardmäßig. Sobald die App geladen ist, ist das in Ordnung, aber die erste Ansicht wartet auf das Skript, und alles, was das rohe HTML liest, sieht kaum Inhalt.
Serverseitiges Rendering
Der Server baut für jede Anfrage das vollständige HTML und schickt es lesefertig; im Browser übernimmt dann React und macht die Seite interaktiv (dieser Schritt heißt Hydration). Besucher und Crawler bekommen beide sofort echten Inhalt. Der Preis ist ein Server, der bei jedem Besuch arbeitet, was unter Last für Kosten und Tempo zählt.
Statische Generierung
Seiten werden einmal beim Deployment gebaut und als einfache Dateien über ein CDN ausgeliefert (einen Dienst, der Dateien nah bei den Besuchern zwischenspeichert). Das ist der schnellste und günstigste Weg, eine Seite auszuliefern, und der robusteste: Zum Zeitpunkt der Anfrage kann nichts schiefgehen. Er passt zu Seiten, die sich selten ändern, etwa Leistungsseiten, Case Studies und rechtliche Seiten.
Incremental Static Regeneration
Ein Mittelweg, den Next.js bietet: Seiten sind statisch, aber jede lässt sich nach einer festgelegten Zeit oder bei geänderten Inhalten im Hintergrund neu bauen, ohne die ganze Website neu zu bauen. Ein Newsbereich oder ein Produktkatalog bleibt so schnell wie statische Dateien und zeigt trotzdem innerhalb von Minuten aktuelle Inhalte.
Mit Next.js wählen Sie den Modus pro Seite, sodass eine Website für ihre Leistungsseiten statisch, für ihren Blog regeneriert und für eine Suchergebnisseite serverseitig gerendert sein kann. React allein liefert clientseitiges Rendering, solange Sie den Rest nicht selbst bauen.
Next.js vs. React für SEO: was ändert sich?
Suchmaschinen können JavaScript ausführen, tun es aber in einem zweiten Durchgang und mit Grenzen, und andere Crawler (darunter viele KI-Assistenten und Tools für Social-Media-Vorschauen) lesen oft nur das HTML, das sie erhalten. Eine Seite, die als leere Hülle ankommt, wird womöglich spät, teilweise oder gar nicht indexiert, und ihre Vorschau beim Teilen bleibt vielleicht leer.
Für SEO zählen drei Dinge am meisten, und der Rendering-Modus entscheidet über alle drei:
- Inhalt in der ersten Antwort. Serverseitig gerenderte und statische Seiten senden Überschriften, Text und Links im HTML. Eine clientseitig gerenderte Seite sendet sie erst, nachdem das Skript gelaufen ist.
- Metadaten pro Seite. Jede Seite braucht ihren eigenen Titel, ihre Beschreibung, ihre kanonische Adresse und strukturierte Daten. Next.js hat dafür einen eingebauten Weg; mit React allein ergänzen Sie eine Bibliothek und stellen sicher, dass sie früh genug läuft.
- Saubere, stabile Adressen. Next.js bildet Ordner auf lesbare Pfade ab. Mit React allein ist das Routing Ihre Wahl, und eine schlechte Wahl (etwa Adressen mit Raute) kann Seiten vor Suchmaschinen verstecken.
Für eine öffentliche Unternehmenswebsite ist React, das nur im Browser rendert, also ein Nachteil in der Suche, und Next.js beseitigt ihn. Keines von beiden schreibt allerdings Ihre Titel, strukturiert Ihre Inhalte oder verdient Ihnen Links. Das braucht unabhängig vom Stack dieselbe Arbeit, wie unser Leitfaden CMS auswählen für die Inhalte erklärt.
Und was ist mit Performance und Core Web Vitals?
Tempo bedeutet bei einer Unternehmenswebsite vor allem den ersten Besuch: wie schnell der Hauptinhalt erscheint, ob das Layout springt und wie schnell die Seite auf einen Tipp reagiert. Google misst das als Core Web Vitals, und Besucher spüren es, bevor sie ein Wort lesen.
Eine clientseitig gerenderte React-App ist beim ersten Besuch im Nachteil, weil nichts Brauchbares erscheint, bevor das JavaScript heruntergeladen und ausgeführt ist. Statische und serverseitig gerenderte Seiten zeigen zuerst den Inhalt und ergänzen die Interaktion danach. Next.js bringt zudem Werkzeuge mit, die standardmäßig helfen: Bilder in passender Größe und passendem Format, Schriften, die ohne Layoutverschiebung laden, und Code, der pro Seite aufgeteilt ist, damit ein Besucher nicht die ganze Website lädt, um eine Seite zu lesen.
Das Framework ist keine Garantie. Eine Next.js-Website voller schwerer Animationsbibliotheken, Tracking-Skripte und großer Hero-Videos kann langsam sein, und ein gut gebautes WordPress-Theme mit schlichtem CSS kann sehr schnell sein. Performance entsteht durch Disziplin in der Umsetzung: wie viel Skript den Browser erreicht, wie Bilder vorbereitet werden, was vor der Einwilligung lädt. Der Stack bestimmt nur, wie leicht diese Disziplin fällt.
Wo und wie wird beides gehostet?
Beim Hosting unterscheiden sich die beiden am stärksten, bei den laufenden Kosten und darin, von wem Sie abhängen.
Eine einfache React-App ist nach dem Build ein Ordner statischer Dateien. Jeder statische Host und jedes CDN kann sie ausliefern, günstig und mit fast keinem Wartungsaufwand auf dem Server. Die Arbeit wandert stattdessen in den Browser.
Next.js lässt sich auf mehrere Arten hosten. Ein vollständig statischer Export läuft auf jedem statischen Host, verzichtet aber auf Server-Rendering und Regenerierung. Für die Serverfunktionen braucht es eine Node.js-Laufzeit: eine verwaltete Plattform, die für Next.js gebaut ist, Serverless Functions eines Cloud-Anbieters oder einen eigenen Server oder Container. Verwaltete Plattformen sind für den Start am einfachsten; ein eigener Server gibt mehr Kontrolle darüber, wo Daten verarbeitet werden, was manche europäischen Unternehmen aus Gründen der DSGVO bevorzugen, und über die Kosten, wenn der Traffic wächst.
Fragen Sie jeden Entwickler, der Next.js vorschlägt, wo es laufen wird, wer dafür zahlt, was passiert, wenn sich die Preise der Plattform ändern, und ob die Website ohne Neubau umziehen kann. Eine gute Antwort nennt einen Plan B.
Next.js und React im direkten Vergleich
Die Tabelle zeigt die Unterschiede, die ein Unternehmen spürt, vom Launch bis ins dritte Jahr.
| React allein | Next.js | WordPress (CMS) | |
|---|---|---|---|
| Was sie ist | Eine Bibliothek für Oberflächen | Ein Framework auf Basis von React | Ein Content-Management-System |
| Standard-Rendering | Im Browser | Pro Seite: Server, statisch oder regeneriert | Auf dem Server, oft gecacht |
| SEO auf einer öffentlichen Website | Schwach ohne Zusatzarbeit | Stark bei Rendering auf dem Server oder vorab | Stark mit gutem Theme und SEO-Plugin |
| Bearbeitung durch das Marketingteam | Braucht ein separates CMS | Braucht ein separates (Headless-)CMS | Eingebaut |
| Hosting | Jeder statische Host | Statischer Host, Node.js-Server oder verwaltete Plattform | PHP und eine Datenbank auf einem Standardserver |
| Am besten für | Apps hinter einem Login | Produkt-Websites, Plattformen, Websites mit App-Funktionen | Marketing-Websites, Blogs, mehrsprachige Inhalte |
| Wichtigste laufende Arbeit | Die gewählten Bibliotheken aktuell halten | Framework-Upgrades folgen | Updates und Sicherheit von Plugins und Core |
Wann ist WordPress die bessere Wahl für die Unternehmenswebsite?
Für viele Unternehmenswebsites lautet die ehrliche Antwort auf „Next.js oder React?“: „keines von beiden“. Besteht die Website vor allem aus Seiten, Case Studies, Artikeln und Formularen, die das Marketing jede Woche bearbeitet und in mehreren Sprachversionen veröffentlicht, gewinnt meist ein Content-Management-System bei Kosten und Unabhängigkeit.
Vor allem WordPress gibt Redakteuren einen visuellen Block-Editor, Entwürfe, Zeitplanung, Rollen und Revisionen, ohne dass ein Entwickler eingreifen muss. Es rendert Seiten auf dem Server, sodass Suchmaschinen sie sofort lesen. Es gibt einen großen Markt an Fachleuten, die damit arbeiten können, was Sie unabhängig von einem einzelnen Anbieter hält. Unsere eigene Website läuft genau aus diesen Gründen auf WordPress, mit einem Theme, das wir selbst geschrieben haben.
Next.js lohnt sich, wenn sich die Website wie eine Anwendung verhält: Konten und Dashboards, ein Konfigurator, Live-Daten, starke Personalisierung oder ein Frontend, das mit einer mobilen App geteilt wird. Es lässt sich trotzdem mit einem CMS (WordPress oder einem anderen) im Headless-Betrieb kombinieren: Redakteure schreiben im CMS, und Next.js zeigt die Inhalte an. Diese Kombination ist leistungsfähig, bedeutet aber zwei Systeme, die gehostet, abgesichert und im Gleichschritt gehalten werden müssen, und Vorschauen unveröffentlichter Seiten brauchen Zusatzarbeit.
Was Sie auch wählen, die Pflege ist real. Eine WordPress-Website braucht Updates und Sorgfalt bei ihren Plugins, wie unser Leitfaden zur WordPress-Sicherheit zeigt; bei einer Next.js-Website müssen Framework und Abhängigkeiten mit derselben Regelmäßigkeit nachgezogen werden.
Wie sollten wir uns entscheiden?
Gehen Sie diese Fragen der Reihe nach durch; die erste klare Antwort entscheidet meist.
- Ist die Website öffentlich, und muss sie in der Suche gefunden werden? Wenn nicht (ein internes Tool, eine App hinter einem Login), reicht React allein oder React mit einem leichten Framework.
- Bearbeiten Menschen ohne Entwicklerkenntnisse oft Inhalte? Wenn ja, brauchen Sie ein CMS: WordPress allein oder ein Headless-CMS mit Next.js davor.
- Verhält sich die Website wie eine Anwendung? Konten, Live-Daten, komplexe Formulare oder ein Konfigurator sprechen für Next.js. Seiten und Artikel sprechen für ein CMS.
- Wer pflegt sie in drei Jahren? Wählen Sie einen Stack, für den Ihr Team oder Ihre Agentur Leute hat. Ein seltenes, sich schnell änderndes Setup ist ein Risiko, wenn eine Person geht.
- Wo wird sie gehostet, und was kostet das bei wachsendem Traffic? Klären Sie einen benannten Host, einen Plan B und eine Vorstellung der laufenden Kosten, bevor Sie sich festlegen.
- Wie viele Sprachen und Märkte? Mehrsprachige Inhalte mit übersetzten Adressen sind in WordPress ausgereift; in Next.js ist das gut möglich, aber mehr davon wird von Hand gebaut.
- Was nutzt der Rest Ihrer Systemlandschaft? Ist Ihr Produkt schon eine React-App, kann eine Marketing-Website mit Next.js Komponenten und Leute mit ihr teilen.
Wenn Sie noch die größeren Optionen abwägen, behandelt unser Leitfaden Website erstellen lassen den Stack, die Umsetzung und die Wahl des Partners ausführlicher.
Häufige Fragen zur Agenturwahl
Ist Next.js besser als React?
Die beiden sind keine Konkurrenten. Next.js baut auf React auf, also ist jede Next.js-Website eine React-Website. Für eine öffentliche Website ist Next.js besser, weil es Seiten auf dem Server oder vorab rendert und Routing und Metadaten übernimmt; React allein passt zu Anwendungen hinter einem Login, wo Suchmaschinen nie hinschauen und der erste Ladevorgang weniger zählt.
Sollte ich für eine neue Website Next.js oder React verwenden?
Beginnen Sie eine öffentliche Website mit Next.js statt mit React allein, weil es echten Inhalt in der ersten Antwort sendet und Adressen, Metadaten und Bilder für Sie übernimmt. Besteht die Website vor allem aus Seiten und Artikeln, die das Marketing bearbeitet, vergleichen Sie zuerst mit einem Content-Management-System wie WordPress, das im Betrieb günstiger sein kann.
Ist React schlecht für SEO?
React an sich ist nicht schlecht für SEO; das Problem ist das Rendering nur im Browser. Eine Seite, die als leere Hülle ankommt, ist darauf angewiesen, dass Crawler JavaScript ausführen, was manche spät und viele gar nicht tun. Wird React auf dem Server oder beim Build gerendert, wie bei Next.js, steht der Inhalt im HTML.
Ist Next.js schwerer zu hosten als React?
Ein einfacher React-Build ist ein Ordner statischer Dateien, den jeder Host ausliefern kann. Next.js lässt sich genauso exportieren, aber seine Serverfunktionen brauchen eine Node.js-Laufzeit auf einer verwalteten Plattform, Serverless Functions oder einem eigenen Server. Das bringt laufende Kosten und die Entscheidung, wer hostet und wo Daten verarbeitet werden.
Können WordPress und Next.js zusammenarbeiten?
Ja. WordPress lässt sich headless nutzen: Redakteure schreiben und veröffentlichen in WordPress, und ein Frontend mit Next.js ruft die Inhalte ab und zeigt sie an. Das verbindet einen vertrauten Editor mit einem individuellen Frontend, bedeutet aber zwei Systeme, die gehostet und aktualisiert werden müssen, und Vorschauen unveröffentlichter Seiten sowie Formulare brauchen zusätzlichen Aufwand bei der Einrichtung.
Wenn Sie einen Stack für eine neue Unternehmenswebsite wählen, ergibt sich die richtige Antwort daraus, was die Website leisten muss, wer sie bearbeitet und wer sie betreut, nicht daraus, welches Framework am neuesten ist. Wir sehen uns Ihre Ziele, Ihre Inhalte und Ihr Team an und empfehlen React, Next.js, WordPress oder eine Kombination, mit schriftlicher Begründung, im Rahmen unserer Leistung Webdesign und Webentwicklung. Sprechen Sie mit uns über Ihr Projekt, und nach einem kurzen Briefing melden wir uns mit einem klaren Vorschlag.
Mehr zum Thema: Webflow oder WordPress 2027: Was zu Ihrem Unternehmen passt.
