Svelte - ja, nein, jein?

October 5, 2021

This is some text inside of a div block.

Ist Svelte nun also nur der heiße, neue Sh*t ? Wir denken nein. Wenn ein stabiles, sauberes und standardisiertes Internet das Ziel ist, dann sagen wir zu Svelte eindeutig ja. Wenn man resiliente und langlebige Webapplikationen programmieren will, dann sagen wir ebenfalls ja.

Was ist Svelte?

"Svelte ist ein Open-Source-Webframework, das es erlaubt, mit hilfe deklarativer Komponenten, reaktive Single-Page-Webanwendungen zu erstellen. Anders als andere clientseitige Webframeworks fungiert Svelte als Compiler, der den Quellcode in imperativen Java Script Code umwandelt." Wikipedia: https://de.wikipedia.org/wiki/Svelte_(Framework)

What the hell is this? - What the hell is this? Jackie Chan Meme — Jackie Chan Meme - What the hell is this?

Und nochmal: was ist Svelte?

Gehen wir einen Schritt zurück und schauen, was heutzutage im Internet zu finden ist. Im Groben gibt es im Internet zwei Arten von Zielseiten für den Durchschnittsmenschen ohne IT Hintergrund: Webseiten und Webanwendungen. Eine Website ist eine Art Schaufenster. Eine Webanwendung hingegen kann zum Beispiel ein Online Terminkalender sein oder Facebook; kurz: eine Website, die Ihnen Funktionalitäten wie Online einen Termin zu buchen, bereitstellt. Beide rufen Sie über Ihren Browser (Firefox, Google Chrome, Internet Explorer, etc.) ab.

Lassen Sie uns einen kleinen Umweg nehmen in dem wir versuchen ein Problem sehr vereinfacht zu beschreiben: Das Internet “vermüllt” und so war das nicht gedacht.

Der Markt für Web Applikationen ist groß und attraktiv (Facebook, Gmail, Pinterest, Linkedin). Dementsprechend strömten auch viele Anbieter, die Web Applikationen erstellen auf den Markt. Dadurch “vermüllte” das Internet: Oft werden unnötige Daten übertragen, unnötige Leistung für einzelne Computer abgerufen, mehr Energie verbraucht als nötig. Funktionalitäten, die in der gewünschten Applikation nichts zu suchen haben, werden dann trotzdem aktiv, wenn der Nutzer auf eine Website surft. Die Website oder Anwendung wird dann zum Beispiel langsam oder schlimmer: sie wird auch noch zum Sicherheitsrisiko.

In den letzten Jahren erlebten wir auch eine Inflation von neuen Frameworks: React kommt von Facebook, Angular von Google und so weiter. Eins ist klar: wenn es einem Konzern wie Google gelingt, dass Entwickler:innen ihre Frameworks verwenden, dann weiten sie ihre Macht aus, denn ihnen “gehört” ja das Framework.

Unser aller Ziel sollte aber ein sauberes und barrierefreies Internet sein; also ein Internet von dem alle profitieren, auch wenn sie schlecht sehen, nicht das neueste internetfähige Gerät besitzen oder eben kein 5G verfügbar ist. Eine gewisse Demokratisierung und Standardisierung wären also sinnvoll und hilfreich. Wenn Sie mehr zum Thema Internet lesen wollen, hier geht es zur Mozilla Foundation: https://foundation.mozilla.org/de.

Svelte können wir also als eine Weiterentwicklung eines Frameworks betrachten:

Es ähnelt einem Komponenten-Framework – wie React oder Vue. Unter Framework versteht man folgendes: Ein Framework “[…] ist selbst noch kein fertiges Programm, sondern stellt den Rahmen zur Verfügung, innerhalb dessen der Programmierer eine Anwendung erstellt [...]”. https://de.wikipedia.org/wiki/Framework

Sveltes “Erfinder” ist übrigens Rich Harris: https://twitter.com/Rich_Harris, er hat auch die Svelte Gesellschaft gegründet, die sich um den Code kümmert: https://sveltesociety.dev/. Er arbeitet für die New York Times und verwendet dort auch Svelte. Der NYT “gehört” Svelte allerdings nicht.

Svelte hat einen wichtigen Unterschied im Vergleich zu React oder Vue: Bundling vs. compiling + shrinking. Es extrahiert CSS, HTML, JS. Sie finden einen Link am Ende des Artikels; dort können Sie die technischen Details nachlesen.

Die Vorteile für Nutzer:innen einer Applikation, die Svelte verwendet

Webanwendungen für leistungsschwächere Geräte: Mit Svelte erstellte Anwendungen haben im Regelfall kleinere Paketgrößen (je nachdem, wie groß die Applikation am Ende ist), was besser für Geräte mit langsamen Netzwerkverbindungen und begrenzter Rechenleistung ist. (Hallo Lüfter!)
Weniger Code bedeutet außerdem weniger Daten zum Herunterladen (Hallo Energie sparen), Analysieren, Ausführen und zum Speichern.
Aufgrund des möglichen Verzichts auf eine JavaScript Laufzeitumgebung können Svelte-Anwendungen so geschrieben werden, dass das Auslesen der Seiten für beispielsweise Suchmaschinen einfacher ist. Gleiches gilt für Bildschirmlesegeräte und damit für die Barrierefreiheit.

Die Vorteile für Programmierer:innen auf einen Blick

Weniger programmieren
Kein Virtual DOM
Echte Reaktivität

Die Vorteile für Kund:innen auf einen Blick

Die Applikation ist robust und leichtgewichtig, das heißt die Qualität der Webapplikation insgesamt ist besser.
Wenn der Programmiercode schlanker ist, dann kann sich eine neue Partei leichter in das Projekt einarbeiten. Es passiert ja doch öfter, dass man den IT Dienstleister wechselt oder dass die federführende Programmiererin kündigt und das Projekt übergeben werden muss.
Ihr Nutzerkreis wird größer weil auch die Nutzer mit älteren Geräten, schlechter Netzabdeckung und visuellen Einschränkungen Ihre Applikation verwenden können. Inklusion ist also von vornherein mitgedacht.

Risiken beim Einsatz von Svelte

Es handelt sich um ein vergleichsweise junges Framework, das heißt, dass die Menschen, die sich um die Pflege und Weiterentwicklung von Svelte kümmern, nicht genug Zeit haben könnten sich auch noch um Anwenderunterstützung zu kümmern. Dem soll allerdings die Gründung der Svelte Society entgegenwirken.
Wenn wir zu viele fertige Komponenten verwenden, sind wir auch abhängiger von diesen Komponenten. Sollte eine dieser Komponenten also zu viel Code beinhalten oder schlecht performen, so wird sich auch unser Programm an dieser Stelle problematisch verhalten.