My Blog Posts

What is Svelte?

What is Svelte?


Svelte is a component framework similar to React and Vue. What's different about Svelte?

Instead of interpreting your application code at run time, Svelte converts your application to vanilla JavaScript at compile time.

You can decide to build your entire app with Svelte or add it slowly and gradually to your code. With Svelte, you can also send the component as a standalon package.

Main Features

Here are some of Svelte's key features, as well as key differences from other frameworks.

Virtual DOM does not exist

We use Virtual DOM in React and Vue. Svelte does not use the Virtual DOM concept and instead shifts the job to a build step that occurs when you create your application.

With Svelte, code is compiled as vanilla JavaScript code without a small framework. It is guaranteed to be smaller and faster and does not require the use of Virtual DOM.

Fewer Codes

Whodoesn'tlike to write a little code? The less code, the fewer errors. I'm not talking about compressing all your code into unreadable pieces of code. I'm talking about writing less code without obsessing over readability. Svelte was created to reduce the amount of code developers write. In other modern frontend frameworks, there is quite a lot of standard code that comes with it.

Let's look at an example to see how Svelte compares to React. Let's look at an example to update your local component state using React and Svelte.

React

// Update state in React
const [count, setCount] = useState(0);
function increment() {
setCount(count + 1);
}

Svelte

// Update state in Sveltelet count = 0;function increment() {
count += 1;
}

You can see how much code has been cut in Svelte.

We should use concepts like useState or setState in React. In Svelte, however, this has been greatly simplified. You can update the State directly with the assignment operator.

No Complex State Management Libraries

Managing your state in an app is one of the most difficult issues to solve. Svelte aims to distance himself from the tendency to use complex state management libraries like Redux. To better understand this concept, you can watch this youtube video by Svelte founder Rich Harris. Here, he talks about rethinking reactivity in frontend frameworks. This video will give you a good start in understanding Svelte.

   



Share this article


Comments (0)

Comment