DEV Community

loading...

First Impression with Svelte

happyharis
Making coding tutorials, understandable and ENTERTAINING!
・2 min read

This article is about my experience with Svelte: likes vs dislikes, and a comparison to a framework (read below to find out which framework)

Svelte is a JS web framework that helps you create web apps by just compiling your code, without a virtual DOM.

It has less boiler plate, no virtual DOM and gives another perception of reactivity. Watch this video about rethinking reactivity. Highly recommend.

After meddling with the framework (by creating a simple landing page),

here are my thoughts on learning about svelte.

Likes

  1. Learning is pretty simple (if you have some background in JS web development) as you are not bombarded with boiler plate. You have to just learn about how Svelte reacts. That's it.

  2. When creating a component, you don't have to write this line of code export default to get exported for other components to be used. WOW.

Dislikes

  1. Routing in Svelte ain't exactly great at explaining to a newbie like me. People who uses Svelte suggest to use Sapper framework (which is built on Svelte). I tried understanding Sapper, and it was overwhelming to comprehend. Yikes 😬

  2. Svelte is pretty new. The community is growing, but it is not matured yet. Just like Flutter back in the days 😆

Which brings me to the comparison of another framework: Flutter.

Similarities with Flutter Web and Svelte

They both, open source, and have their logical code on the top part of the file.

// In Svelte

<script>Logic code here</script>

<style></style>

<html></html>

Enter fullscreen mode Exit fullscreen mode
// Usually when I develop in Flutter

Logic code here

Widget {
 // the html/css
}

Enter fullscreen mode Exit fullscreen mode

Difference with Flutter Web and Svelte:

Flutter - amazing huge team, created by Google, and companies (CodeMagic, Rive) creating tools for the framework

Svelte - Rich Harris and his videos (highly recommend)

I really can't wait what Svelte would be offering next. Thanks for reading!

Discussion (7)

Collapse
mattwaler profile image
Matt Waler

Hey! I couldn't agree more with your notes about sapper being confusing and Svelte needing more support. I have a starter repo on github with Svelte and Routify configured, which is the best Svelte router I've seen thus far. Here is the link!

github.com/mattwaler/svelte-starter

Collapse
csaltos profile image
Carlos Saltos

The next Svelte has the router included and a lot of new powerful improvements ... and by the way, Rick Harris is just the public face of Svelte, the team is bigger and solid with a good growing community.

I hope you enjoy creating productive apps with Svelte and Svelte Native.

Collapse
happyharis profile image
happyharis Author

thank you ☺️

Collapse
devdufutur profile image
Rudy Nappée

Svelte 3 seems to be promising but IMO it's currently too risky to start large scale project with it.

Collapse
csaltos profile image
Carlos Saltos

At Talenteca we are migrating to Svelte. We considere Svelte 3 it’s already a solid product that will improve a lot of things for us and our clients business.

Collapse
happyharis profile image
happyharis Author

What's the risk are you looking at?

Collapse
roshnet profile image
Roshan Sharma

Hahha, I totally agree with the dislike #1.
It took me a while to wrap my head around how routing works in Sapper.
Regardless, I believe Svelte is gonna set the new de-facto for web and mobile apps.

PS: I wrote a short blog post about how I figured a bit about Svelte routing, might come in handy for someone wandering like me :p

roshnet.github.io/2020/07/14/url-p...