Web designing can be a tedious, repetitive and uninteresting process, especially for the fact that it is ever-evolving. A technology you decide to learn today might become obsolete tomorrow with a better tool replacing it.
I have been in search for better approach to web development as existing methods are not intuitive, complex and have a steep learning curve. I found many temples engines – Wix, Webflow DreamWeaver, Blue Griffon, WordPress - and libraries - Angular, React, jQuery, C# with Razor. Most of which will get the job done. But you will always run into issues when trying to fix a small bug or modify/add a custom feature. The source code is usually filled unnecessary and unused codes which will definitely be a nightmare to go through.
I came across this blog: Best Frontend Frameworks of 2021 for Web Development. The blog listed the top 9 frontend frameworks according to various features. That was the first time I ever came across Svelte. Guess what? Svelte was not among the top 5 frameworks on the list. In fact it was last. But the outlined features caught my attention. Especially for that fact that it was the newest on the list at the time and lightweight.
I did a little research and found the maker of Svelte was an average looking man, Rich Harris, who was a graphics editor for New York Time.
Really! A graphic designer. Well, I could relate because at the moment I also work as a graphic designer, but I know deep down I should be programming big time.
I was still sceptical but after watching this great talk by Rich Harris about rethinking how we build frontend JavaScript frameworks, I was sold. If you have half an hour to kill and haven’t seen it, please check it out. I promise it is better than any content you will find on my blog.
Svelte is a new reactive component-based approach to web design. Svelte works differently by putting the work into a compile step instead of putting them in the browser, unlike frameworks like React and Vue. It does many other things easily and improves most of the bottlenecks of using other frameworks.
Svelte is “a compiler that takes your declarative components and converts them into efficient JavaScript that surgically updates the DOM” when the state of your application changes. Meaning, you can build boilerplate-free components using CSS, HTML and pure JavaScript, and Svelte will compile it into small and lightweight JS with built-in reactivity.
Visiting the official website of Svelte and SvelteKit, It is clearly seen that they are well documented and have good examples.
At this point my palms are sweaty, knees weak, arms are heavy, I was ready to ~get my hands wet~ dive in head first and hope for the best.
I lunched VS Code - the one IDE to rule them all, opened the node terminal and with three lines of code in less than one minute I was able to get my first Svelte web app up and running. My mind was blown, this must be sorcery. Never seen anything like it.
And the rest is history.
I would recommend Svelte if you are:
- New in web development, lucky you. You will not have to through the pain of unlearning React😊.
- A veteran in web development, you’ll realize how easy life can be.