Unlike today, in the past, it was really challenging to develop or even create web apps, partly because of problems in organizing and deploying JavaScript files. This problem was somewhat addressed in React and Vue. But then came Svelte in 2016 - created by Rich Harris, a graphics editor.
Svelte is basically a front-end, open-source JavaScript framework that helps developers structure apps using JavaScript. Developers can also customize the web in Svelte. For this reason, Svelte is also called a compiler. Sure, it gained traction after its release, but its popularity soared in 2019 with its version 3 hitting the market. Today, it has received 74.2k stars.
According to one survey, 47% of developers are interested in learning about Svelte, while almost 24% aren't interested in using it. Part of this may be because developers can save their time in Svelte because they don't have to write a lot of code. A simple format written in TypeScript is used in Svelte. No virtual DOM is used. Developers don't have to load libraries to the browser to run Svelte code.
There's no overhead as well. In Svelte, the DOM is updated during build time. Apps can be made small in size once compiled. The source code is also easier to read since it contains all - JavaScript, HTML, and CSS - in one file. All the components used in a Svelte app are compiled into different JavaScript modules.
Using the preview option, the compiled program's stability can be seen. Hence, the final script is light and faster when developers run it. The CSS components can be prevented from errors by using HTML markup or even simple XML files.
Furthermore, using Svelte stores, you don't have to fret about memory leaks. This is because if you write $ sign in Svelte, then store variables will subscribe and unsubscribe automatically. You also don't need to use third-party state management. A variable can be defined as a store and can be later used in Svelte files - granted $sign is used afterward.
Moreover, svelte highlights unused CSS checks. This means there will be concise code that's also free from leftover code snippets. Also, since components can be exported automatically, you can save a lot of time when it comes to exporting the code from components A to B.
There are many built-in animations like spring and fade, slide, etc., so make sure you use these and make your apps super interactive! And although it's comparatively easy to learn Svelte if you know HTML and CSS, it has a small community.
Top comments (0)