Why I Love Svelte (and SvelteKit)

My journey with Svelte didn’t begin intentionally.

I was fresh out of college, frantically searching for any computer-science-adjacent job. This was in the oversaturated, post-COVID era of the tech job market. With limited options, I was ready to hop into a corporate sales job that might eventually lead to an engineering role.

Knowing myself, this wasn’t ideal.

That’s when I found an Indeed listing for an entry-level Svelte developer. I had no idea what that meant, but I was proficient in JavaScript and CSS, so I figured I’d give it a shot.

Long story short: I got hired. And now, I’m a Svelte developer.

Since this has been my only job post-college, I don’t have long-term, professional experience with any other JavaScript frameworks. So this post isn’t about why you should convert to Svelte because your framework sucks, it’s just an appreciation post for the framework I’ve grown alongside.

Now, on to the good stuff.

Reactivity with Runes

My favorite Svelte 5 feature is its new reactivity model: runes. Coming from over a year of Svelte 4 experience, it felt a little alien at first.

Like learning any new syntax, the strangeness faded. Your brain just needs a little time to rewire and adapt to the language of Svelte 5. Once it clicks, everything feels more deliberate and readable.

The stars of the show-$state, $derived, and $effect-make it obvious what’s reactive, what depends on what, and when things will update. There’s less obfuscation and far less guesswork.

Here’s a classic example using two of the runes. Finding examples like this in the official docs and other blog posts helped everything click for me early on:

What’s Going On

• $state creates a reactive variable (count) that updates the UI automatically when changed.
• $derived creates a similarly reactive value (doubled), but this one is “derived” (get it?) from the previously defined count
• Clicking the button increments count, which also updates doubled

The explicit nature of the syntax removes ambiguity. The reactivity is right there, in plain sight.

Seamless Typescript Integration

I didn’t expect to care much about TypeScript when I first started. But over time, I’ve come to appreciate the clarity and safety it provides.

With Svelte 5, TypeScript just works. I’ve never really had to think about it. There’s no strange config overhead or special syntax to memorize.

Components and logic live in .ts or .svelte files, and the type system fits right in. Props, stores, runes… they all feel designed with TypeScript integration in mind.

Svelte doesn’t treat TypeScript like an afterthought. It feels native.

Smaller Bundle Sizes

This one took me a little while to appreciate.

When you’re just starting out, bundle size can feel like an afterthought. With so many other variables to juggle, optimizing your code can seem daunting.

If you’re doing any client-facing work, you’ll quickly see the impact of Svelte 5 (especially when paired with SvelteKit).

Faster load times, smoother interactions, page preloading, fewer things breaking on slower networks… I could go on and on.

Svelte’s compiler-first approach ships less code to the browser by default. There’s no virtual DOM or runtime framework being sent down the wire. Just the JavaScript your app actually needs.

The result is a site that feels lighter, even before you’ve done any manual optimization. What a great foundation to build from!

Conclusion

There’s a lot more I could say about Svelte 5 and SvelteKit. It has been a joy to work with them over the past few years.

These are just a few of the things I thought would be worth sharing-if you’re in the “web dev” world and haven’t heard of Svelte yet.

I’m sure I’ll continue to find reasons to love it. For now, these are the ones that stuck.