Everything You Need to Know About the Most Popular JS Frameworks - Part 4

This is the fourth article in our Frameworks series. Here are the first, second and third articles.

Svelte: black magic

The list of top 3 frameworks seems to be clear and commonly accepted. However, the web development community felt these tools aren't enough. For solving everyday tasks, they wanted a fast and easy-to-use framework with concise code as well as out-of-the-box development capabilities. Neither React, Angular, nor Vue can offer particularly small bundle sizes out of the box.

Svelte was introduced in 2016. Although its first version wasn't promoted by its creators, starting in 2018, from the second and third versions, Svelte's developers started promoting it and the framework started to become popular in the development community.

Features

Let's go over how Svelte works. First, we write high-level source code using the declarative approach. That means that our code should describe what needs to be done, then the framework will decide how to do this. In other words, instead of describing how to achieve the desired result, we should just describe it. In turn, Svelte will return the low-level code to accomplish what it should. For example, inside the browser:

Essentially, Svelte is a compiler that generates minimal and optimized JavaScript code that results in a small bundle size. This is what sets Svelte apart from other tools. Let's look at the table with the minified bundles of different libraries and frameworks without any of an application's code inside:

‍

These numbers decrease over time as each framework improves, except for Svelte, which always has 0 KB.

Apart from that, Svelte has some other cool features:

• High performance at runtime. For example, when the code is running in a browser
• A library of out-of-the-box animations
• An isolated environment for interacting with styles
• SSR support
• Cross-platform capabilities (Svelte Native)
• Typescript support

No wonder Svelte is getting more and more popular. Svelte is also newbie-friendly and offers a great interactive tutorial.

Disadvantages

The big disadvantage with Svelte comes from the lack of an officially supported command line interface (CLI). Currently, creating and bundling a project сan be done only with the help of third-party templates for deployment.

Apart from that, compared to React, Vue, and Angular, Svelte has a small ecosystem. In the case of React, it's much easier to find the necessary ready-to-use component or library than it is to find an analog for Svelte. In fact, with Svelte, it can take quite a lot of time to find a suitable alternative. That's not to mention having to fine-tune this alternative tool so that it works with your project. Moreover, there's no guarantee that this solution will have all the functionality you need and it might even be riddled with bugs.

Another disadvantage of Svelte is that it has a small community of developers. We've drawn this conclusion based on the number of questions about this framework on Stack Overflow, compared to Angular or Vue.

Although big corporations don't support Svelte, nonetheless, this JavaScript framework is gaining popularity thanks to its community. Despite not having a large marketing budget, Svelte still managed to get 45,000 stars on Github. Additionally, Svelte is frequently discussed at various IT conferences and on blogs, providing further proof of just how promising this framework is.

‍

‍