Sage-Code Laboratory
index<--

Introduction to Svelte

Svelte is a tool for building fast web applications. It is similar to JavaScript frameworks such as React and Vue, which share a goal of making it easy to build slick interactive user interfaces.

Svelte converts your app into ideal JavaScript at build time, rather than interpreting your application code at run time. This means you don't pay the performance cost of the framework's abstractions, and you don't incur a penalty when your app first loads.

Highlighted features:

So before we dive into learning how to use Svelte, let's learn what it can do for us and why the effort to learn it. I have just copy these from Svelte homepage and try to make sense of it all.

write less code

Reducing the amount of code you have to write is an explicit goal of Svelte. Unlike React and Vue, Svelte will help you avoid boilerplate code. Svelte is actually like a new language that must be compiled in order to work.

no virtual DOM

There is a claim that DOM of the browser is slow. DOM="Document Object Model". Therefore reactive frameworks: Vue and React are having a parallel DOM that is more efficient. This claim is temporary maybe true but in time we know that companies optimize and improve upon things. So in the future we think the original DOM will become more efficient. Therefore Svelte do not use a virtual DOM.

truly reactive

Svelte 3 moves reactivity out of component API and into the Svelte language. It enable creation of: cybernetically enhanced web apps. Moving reactivity into the language compiler. Svelte becomes a low level declarative language that create reactivity at compile time improving efficiency at runtime.

Learning Svelte


Read next: Server Side JS