Wir bauen Frontends mit React, Vue und Svelte — alle drei produktiv, alle drei in laufenden Projekten. Dieser Artikel ist kein Listicle, sondern ein Versuch zu erklären, wann wir welches Tool empfehlen, was die jeweilige Philosophie wirklich bedeutet, und wo die Tools tatsächlich aufeinandertreffen.
Die kurze Version: React ist eine Library, Vue ein progressives Framework, Svelte ein Compiler. Wenn man das einmal verstanden hat, fallen die meisten "Was ist besser?"-Diskussionen weg.
React: UI-Library mit dem größten Ökosystem
React rendert Komponenten. Mehr nicht. Routing, State, Forms, Server-Logik — alles kommt aus dem Ökosystem oder aus einem Meta-Framework wie Next.js. Das ist Stärke (maximale Flexibilität) und Schwäche zugleich (Decision Fatigue bei jedem neuen Projekt).
Was React stark macht:
- Mit Abstand größtes Ökosystem an Bibliotheken und Komponenten
- Reife Meta-Frameworks: Next.js für Full-Stack, Remix für Form-Actions, Astro für Content
- Server Components in Next.js verändern, wie wir Datenladelogik schreiben
- Größter Talentpool — auch im DACH-Raum
- JSX ist nach kurzer Eingewöhnung sehr expressiv
Wo es nervt:
- Sehr viele Wege, dasselbe Problem zu lösen — Patterns variieren zwischen Teams stark
- Re-Render-Verhalten und Memoization (useMemo/useCallback/React.memo) braucht Verständnis
- Stale-Closure-Fehler in useEffect sind ein Klassiker
- Bundle-Size ist nicht der Stärkste — gut für komplexe Apps, übertrieben für Marketing-Sites
Vue: Das progressive Framework mit klarer Linie
Vue gibt mehr Antworten vor: Vue Router fürs Routing, Pinia für State, Vite als Build-Tool, Nuxt als Meta-Framework. Single-File Components mit klar getrennten Bereichen für Template, Logik und Style sind angenehm lesbar. Die Composition API (seit Vue 3) bringt die Flexibilität von React-Hooks, aber mit deutlich weniger Reaktivitäts-Footguns.
Vue spielt seine Stärken aus, wenn:
- Schneller Projektstart wichtig ist — offizielle Lösungen für die meisten Probleme
- Das Team gemischte Skill-Level hat — die Lernkurve ist sanfter
- Template-Syntax bevorzugt wird (Direktiven wie v-if/v-for statt JSX-Conditionals)
- Reaktivität "einfach funktionieren" soll — kein useState/useEffect-Boilerplate
- Nuxt 3 als Full-Stack-Meta-Framework ausreicht (SSR, SSG, API-Routes, ISR)
Realistische Grenzen:
- Ökosystem ist kleiner — bei sehr spezifischen UI-Komponenten muss man häufiger selbst bauen
- Im englischsprachigen Enterprise-Sektor weniger verbreitet als React
- Talentmarkt in DACH ist da, aber kleiner
Svelte: Der Compiler-Ansatz
Svelte ist fundamental anders: Es ist kein Runtime-Framework, sondern ein Compiler. Was im Browser ankommt, ist hochoptimierter Vanilla-JavaScript-Code, der das DOM direkt manipuliert — ohne Virtual DOM, ohne Framework-Overhead. Das hat reale Konsequenzen für Bundle-Size und Time-to-Interactive.
Mit Svelte 5 und den neuen Runes ($state, $derived, $effect) ist die Reaktivität explizit und vorhersagbar geworden — vorher war sie magisch und für Newcomer manchmal verwirrend. SvelteKit als Meta-Framework liefert File-Routing, SSR/SSG, Form-Actions und Server-Endpoints out of the box.
Wofür wir Svelte produktiv einsetzen:
- Marketing- und Content-Sites, bei denen Bundle-Size und Time-to-Interactive direkten Business-Impact haben
- Static Sites mit SvelteKit + adapter-static — minimaler Build-Output
- Interaktive Tools (Konfiguratoren, Visualisierungen) — Reaktivität ist hier ein Genuss
- Server-rendered Web-Apps mit Form-Actions — kein separater API-Layer nötig
Wo wir es nicht empfehlen:
- Wenn ein großes Komponenten-Ökosystem (Charts, komplexe Tables, Maps) zwingend ist — Svelte hat gute Optionen, aber weniger Auswahl
- Wenn das Team langfristig mehrere React-Devs einstellen will (Talentmarkt schmaler)
- Bei Mobile-Hybrid-Apps via Capacitor — geht, aber React/Vue haben dort mehr Beispiele und Plugins
Performance: Was die Benchmarks nicht sagen
In klassischen Benchmarks (js-framework-benchmark) liefern alle drei vergleichbare Werte — gemessen wird oft synthetisch, und die Unterschiede sind in echten Projekten meist nicht spürbar. Wo es einen realen Unterschied gibt: Bundle-Size und Initial Load.
Faustregeln aus unseren Projekten (gzippte Runtime-Größen, jeweils ohne Anwendungscode):
- Svelte: ~5 KB Runtime — der Rest ist eigener Code
- Vue: ~30 KB Runtime
- React + ReactDOM: ~45 KB Runtime
In großen Apps relativiert sich der Unterschied — die Anwendungslogik dominiert. Bei kleinen Marketing-Sites ist Svelte oft spürbar schneller im First Paint.
Server-Side: Next.js vs. Nuxt vs. SvelteKit
Alle drei haben heute ausgereifte Meta-Frameworks mit SSR, SSG, File-Routing und API-Endpoints. Unterschiede liegen weniger in Funktionsumfang als in Defaults und Patterns.
Was wir in der Praxis sehen:
- Next.js: stärkster Fokus auf Server Components und Streaming — die mächtigste, aber auch komplexeste Architektur
- Nuxt 3: pragmatischer "Universal-Mode" mit Auto-Imports — sehr gute Developer Experience für Standard-Projekte
- SvelteKit: einfachstes Mental Model — Server-Endpoints und Form-Actions wirken wie eine Mini-Backend-Lösung ohne Magie
Wann wir welches Tool empfehlen
React + Next.js: bei großen, langlebigen Apps mit komplexem State, hohem Bedarf an Drittanbieter-Komponenten oder wenn das Team React-Talent skalieren will.
Vue + Nuxt: bei Projekten mit gemischtem Skill-Level, schnellen MVPs, oder wenn die Vorteile von Single-File Components und Composition API für das Team passen.
Svelte + SvelteKit: bei Marketing-Sites mit hohem Performance-Anspruch, statischen Sites, interaktiven Tools — überall, wo kleine Bundles und schnelles First Paint einen messbaren Effekt haben.
Fazit: Drei gute Antworten auf unterschiedliche Fragen
React, Vue und Svelte sind keine Konkurrenten in einem Nullsummenspiel — sie lösen jeweils unterschiedliche Probleme besonders gut. Wir wählen pro Projekt, nicht pro Team-Vorliebe, und sagen Kunden ehrlich, was die Wahl im Tagesgeschäft bedeutet (Talentmarkt, Wartbarkeit, Lernkurve für interne Übernahme).
Der häufigste Fehler bei der Wahl: Sich für ein Tool entscheiden, das das aktuelle Team nicht beherrscht, weil es "moderner" wirkt. Die Team-Realität schlägt jedes Benchmark.