DEV Community

Cover image for Why you need to start using Svelte Js for web development projects if you still don't

Why you need to start using Svelte Js for web development projects if you still don't

vaniukov on March 26, 2020

If you are in web development, you have probably heard about Svelte Js. But you asked, why it is becoming so popular web framework and what benefit...
Collapse
 
madslundt_96 profile image
Mads Engel Lundt • Edited

There are SSR tools such as NextJS for React and NuxtJS for Vue. They have become quite popular because you can now do SEO in JavaScript web apps, static exporting, optimized script generating, etc.
Is there anything similar to Svelte?

Also when doing TypeScript in React you get type-checking in the HTML because you write jsx (tsx).
In Vue you only have type-checking in the JavaScript part and not in the HTML.
Do you have the same type-checking level in Svelte as you do in React?

Collapse
 
yellow1912 profile image
yellow1912 • Edited

The last time I checked it, svelte doesn't really support legacy apps (the type where html is generated by backend code such as php) and is loaded separately from js files. I went with vuejs for that reason.

Collapse
 
kieranholroyd profile image
Kieran

inertia.js

Collapse
 
yellow1912 profile image
yellow1912

Thank you, this is interesting. I have implemented my own solution but this is definitely worth checking.

Collapse
 
vaniukov profile image
vaniukov

Thanks for sharing your experience. Vuejs is definitely a better choice for the legacy apps in that case.

Collapse
 
pencillr profile image
Richard Lenkovits

I have this thing that I don't like to touch technologies that don't make it to the Stackoverflow survey results. Still, I always hated React's state management, so I would be happy to move somewhere if the market shifted. I plan to give Svelte a look. Just my personal opinion.

Collapse
 
vaniukov profile image
vaniukov • Edited

Thanks for sharing your thoughts. The market shift really matters for devs, so maybe somewhen it shifts to such technologies as Svelte, who knows. Anyway, it's a good idea to give Svelte a look, hope you would like it.

Collapse
 
jonrandy profile image
Jon Randy 🎖️

It's very similar to Riot JS which has been around for a lot longer - riot.js.org

Collapse
 
vaniukov profile image
vaniukov

Thanks for sharing. They both really have a lot of similarities.

Collapse
 
dexygen profile image
George Jempty

I've already been down the Vue.js route and I'm not going down a similar route again with the potential to leave me unemployed altogether too often.

Collapse
 
vaniukov profile image
vaniukov

In this case, agree, Vue.js is a good option instead.

Collapse
 
karfau profile image
Christian Bewernitz

I was convinced I'll read the whole article after the second paragraph :)

Collapse
 
karfau profile image
Christian Bewernitz

It helped me to understand the differences, but I guess there is much more to it since your comparison basically only covers component development, right?
The whole topic of building apps including state management is still unclear to me and will need further investigation. (Can you recommend anything specific?)
For fully knowing when to use it and when not, as promised in that second paragraph, I think I need more information.

Collapse
 
vaniukov profile image
vaniukov

Sure, the article is more like a quick overview of the Svelte differences with the main focus on the components (as for me it's the main difference - just my opinion).
I can recommend resources that help me - I will not wonder you if I say that I started with Svelte documentation :) And these a few guides helped me a lot in the development process:
jsreport.io/building-an-app-with-s...
medium.com/swlh/simple-svelte-3-ap...

And about when to use it and when not, if you're going to use Svelte start with SPA development, think it's perfect for that. For MPA building, you can try to use Sapper framework sapper.svelte.dev/

Collapse
 
mckkaleb profile image
Kaleb McKinney

How would it work if you wanted multiple pages, not just index.html?

Collapse
 
vaniukov profile image
vaniukov

You can try Sapper sapper.svelte.dev/ that works pretty well if each of your web pages is is a component.
Besides, here is another great guide of custom solution medium.com/swlh/simple-svelte-3-ap...

Collapse
 
ajnasz profile image
Lajos Koszti

Nice ~3MB gif about scrolling on github. I wish I could scroll like this myself. :(

Collapse
 
vaniukov profile image
vaniukov

You know, gif is more like here to break the text and make the reading more engaging.
Besides, I just like to highlight that despite Svelte is a young framework, it has a big developers community.

Collapse
 
vaniukov profile image
vaniukov

Definitely agree, Svelte is a great option to use instead.

Collapse
 
madslundt_96 profile image
Mads Engel Lundt

Thank you. I'll have a look at that