Svelte ist ein JavaScript-Framework für Benutzeroberflächen, das Rich Harris 2016 vorgestellt hat. Es arbeitet als Compiler und rechnet Komponenten schon beim Bauen der Seite in Browsercode um. Im Browser des Besuchers läuft danach nur noch das Ergebnis.
- Svelte
Ein JavaScript-Framework, das Komponenten beim Bauen in kleines, direkt ausführbares JavaScript übersetzt.
Beispiel: „Das Svelte-Widget für den Tarifrechner wiegt nach dem Bauen nur ein paar Kilobyte.“Verwandt: SvelteKit, das Meta-Framework auf Basis von Svelte, vergleichbar mit Next.js für React.
Abgrenzung zu React: React liefert eine Bibliothek mit, die im Browser Änderungen abgleicht. Svelte schreibt den Code für jede Änderung schon vorher aus.
Wie Svelte als Compiler arbeitet
Eine Svelte-Komponente sieht aus wie eine HTML-Datei mit einem Script- und einem Style-Block. Beim Bauen erzeugt der Compiler daraus JavaScript, das genau die Stellen der Seite ändert, die von einem Wert abhängen.
Ein virtuelles Abbild der Seite, wie React es verwendet, entfällt dadurch. Das spart Rechenarbeit im Browser und Bytes in der Leitung, vor allem auf schwächeren Smartphones.
Wofür Svelte sich eignet
Für interaktive Teile, die schnell laden müssen: eingebettete Rechner, Karten und Datenvisualisierungen. Rich Harris kam aus der Grafikredaktion von Zeitungen, und das merkt man dem Werkzeug an.
Seit 2021 arbeitet er bei Vercel, dem Unternehmen hinter Next.js, an Svelte und SvelteKit weiter. Mit Version 5 hat Svelte seine Reaktivität auf sogenannte Runes umgestellt, die ausdrücklicher festlegen, welcher Wert sich ändern kann.
Was Svelte gegenüber React fehlt
Vor allem die Größe des Ökosystems. Für React gibt es zu fast jeder Aufgabe mehrere fertige Pakete und viele Entwickler auf dem Markt; bei Svelte ist beides kleiner.
Für ein Projekt, das jahrelang gepflegt werden soll, ist das ein echter Faktor. Die Frage ist dann weniger, welches Framework technisch eleganter ist, als ob sich in drei Jahren noch jemand findet, der den Code übernimmt.