Was ist Svelte und warum wird es kompiliert
Verstehen Sie Sveltes Compiler-First-Ansatz und die Unterschiede zu React und Vue.
Was ist Svelte und warum wird es kompiliert ist eine kostenlose Sveltejs Academy-Lektion auf CoddyKit. Dies ist Lektion 1 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des Sveltejs Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der Sveltejs Academy-Kurs umfasst insgesamt 4 Lektionen.
Willkommen bei Svelte
Svelte ist ein compilerzentriertes UI-Framework. Im Gegensatz zu React oder Vue erledigt Svelte den Großteil seiner Arbeit zur Build-Zeit und nicht zur Laufzeit.
Keine virtuelle DOM
React vergleicht zur Laufzeit ein virtuelles DOM. Svelte kompiliert Ihre Komponenten stattdessen in hochoptimiertes Vanilla-JavaScript, das das DOM direkt aktualisiert.
Weniger Code wird ausgeliefert
Da Svelte kompilierten Output ausliefert, senden Sie dem Browser normalerweise weniger JavaScript. Die Bundle-Größen sind winzig.
Format der Komponentendatei
Eine Svelte-Komponente befindet sich in einer .svelte-Datei, die drei optionale Bereiche enthält: Script, Markup und Style.
<script>
let name = "world";
</script>
<h1>Hello {name}!</h1>Reaktivität durch Zuweisung
In Svelte löst bereits die Zuweisung eines neuen Werts zu einer Variablen eine UI-Aktualisierung aus. Es gibt keinen Aufruf von setState.
<script>
let count = 0;
function inc() { count = count + 1; }
</script>
<button on:click={inc}>{count}</button>Single-File-Komponenten
Markup, Logik und bereichsbezogene Styles befinden sich gemeinsam in einer Datei. Diese Zusammenführung macht Komponenten leicht verständlich und einfach zu refaktorieren.
Bereichsbezogene Styles standardmäßig
Jedes von Ihnen geschriebene <style> ist ausschließlich auf die Komponente begrenzt. Damit gehören CSS-Konflikte zwischen Seiten der Vergangenheit an.
<style>
p { color: tomato; }
</style>
<p>I am tomato</p>Leistungsvorteile
Da kein Overhead eines Frameworks zur Laufzeit anfällt, sind Svelte-Apps auf leistungsschwachen Geräten tendenziell schneller als entsprechende React- oder Vue-Apps.
SvelteKit, das Meta-Framework
SvelteKit baut auf Svelte auf und ergänzt Routing, SSR und Datenladen. Die meisten produktiven Svelte-Apps verwenden SvelteKit.
Wann Svelte seine Stärken ausspielt
Svelte eignet sich ideal für Marketing-Websites, Dashboards, mobilfreundliche Apps und überall dort, wo Bundle-Größe und DX wichtig sind.
Zusammenfassung des Vergleichs
React, Vue und Angular liefern alle eine Laufzeitumgebung aus; Svelte kompiliert sie weg. Das Ergebnis sind kleinere Bundles und einfachere mentale Modelle.
Kurze Überprüfung
Testen Sie Ihr Verständnis.
Zusammenfassung
Sie wissen nun, dass Svelte Komponenten kompiliert, weniger JS ausliefert, bereichsbezogene Styles verwendet und mit SvelteKit vollständige Apps ermöglicht. Als Nächstes erstellen Sie Ihr erstes Projekt.
Häufig gestellte Fragen
Ist die Lektion „Was ist Svelte und warum wird es kompiliert“ kostenlos?
Ja — der vollständige Text von „Was ist Svelte und warum wird es kompiliert“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des Sveltejs Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der Sveltejs Academy-Kurs umfasst insgesamt 4 Lektionen.
Was lerne ich in „Was ist Svelte und warum wird es kompiliert“?
Verstehen Sie Sveltes Compiler-First-Ansatz und die Unterschiede zu React und Vue. Du übst Sveltejs Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.
Brauche ich Erfahrung, um Sveltejs Academy zu starten?
Keine Vorkenntnisse erforderlich. Sveltejs Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 1 von 4.
Wie lange dauert die Lektion „Was ist Svelte und warum wird es kompiliert“?
Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.
Kann ich in dieser Sveltejs Academy-Lektion Code schreiben und ausführen?
Ja. Jede Sveltejs Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.
Alle Lektionen in diesem Kurs
- Was ist Svelte und warum wird es kompiliert
- Ein Projekt mit npm create svelte erstellen
- Projektstruktur: src routes static
- Der Entwicklungsserver und Hot Module Replacement