Dev — First steps in Svelte

Introduction Svelte

Svete is a framework. It has concepts similar to those of React, Vue and Angular but, at the same time, it comes with very important differences. One of the most important differences is that important is that Svelte has a previous compilation step. This happens because the code, even if it is based on HTML, CSS and Javascript, is a code that is not understood by the browser without a previous the browser without a previous compilation.


function easyToUse() {

return “This is the main and most important feature. With this framework you won’t have to deal with complex theoretical aspects, typical of this technolog of this technology: With just basic Javascript you can get the same results as with same results as with Angular, React and Vue.”;


function fastCompilation() {

return “Svelte compiles and packages its components in a very compressed Javascript file, with just the file, with only the Javascript code needed for your application. This means that it is possible to create much smaller and much faster applications and faster than those offered by its competitors.”;


function agileConsole() {

return “A console is available to start your application and install dependencies. It is surprising the speed in which this process happens especially when compared to Angular.”;


function noVirtualDOM() {

return “Svelte is a compiler, what it does, is to avoid the use of the Virtual DOM and taking advantage of the compilation step, to wrap state and property changes in methods that will surgically update the DOM.”;


function reactiveComponents(){

return “ Svelte understands components as reusable blocks of code (whether HTML, CSS or Javascript) that are written inside a .svelte file. In this sense, the reactive components of this framework allow updates to occur only in the affected DOM. In other words, Svelte updates only the affected node whenever the state of an app changes. the state of an app changes.

For this reason, it is remarkable the good composition of the components, since they have an excellent communication between them in a simple and agile way from the programming point of view.”;


Example of Hello world

Full-stack developer in training Twitter: @edertassin