idolodev
sveltekit

Next.js Is Good...But Have You Tried SvelteKit?

Next.js Is Good...But Have You Tried SvelteKit?
0 views
3 min read
#sveltekit
Table Of Content

I got bored… again. So I did what any reasonable developer does: I learned a new framework.

After years of building with React.js and Next.js I picked up Svelte and SvelteKit. It’s a frontend framework that helps you build fullstack apps in the simplest way ever.

Here’s why SvelteKit feels like the future (and why you should try it too).

SvelteKit is built with simplicity at its core

I kept seeing this headline everywhere when researching Svelte before picking it up, but I didn’t really get it. React and Next.js are already easy. How can something be simpler?

Turns out it can.

It's Just HTML

When we started React, we had to learn JSX, the syntax extension that lets us write HTML-like code inside JavaScript. JSX is part of the React ecosystem and is handled by tools like Babel.

Svelte takes a different approach.

To make a component, you just create a .svelte file, write your HTML, and the Svelte compiler turns it into highly optimized JavaScript. No wrapper function, no return statement, no JSX.

And because everything is closer to native HTML, the learning curve feels smoother. Even the rafce VS Code snippet becomes unnecessary.

State and Reactivity

State and reactivity in SvelteKit are extremely simple.

React version:

import { useState } from "react";

export default function MyPage() {
  const [count, setCount] = useState(0);

  return (
    <div>
      <h1>{count}</h1>
      <button onClick={() => setCount((prev) => prev + 1)}>
        Increment Count
      </button>
    </div>
  );
}

Svelte version:

<script>
  let count = $state(0)
</script>

<div>
  <h1>{count}</h1>
  <button onclick={() => count++}>Increment Count</button>
</div>

It feels like writing normal JavaScript. No setState. No hooks. You just reassign variables and Svelte updates the UI.

This is why Svelte feels relatable to anyone coming from plain HTML/CSS/JS.

DOM vs Virtual DOM

React (and Vue) use a Virtual DOM. It used to be a big performance innovation, but in 2025, it's extra machinery that often isn’t needed.

SvelteKit avoids the Virtual DOM entirely. It compiles components into tiny, optimized JavaScript that updates the DOM precisely where needed.

More on that here

This is why Svelte apps ship far less JavaScript compared to React apps.

But React Has All the Libraries

A fair argument. The React ecosystem is unmatched:

But SvelteKit isn't empty:

And honestly, many libraries work with Svelte just fine because they’re framework-agnostic.

Reliability and Jobs

SvelteKit is production-ready and used by companies like:

  • Apple
  • The Guardian
  • Brave
  • Rakuten
  • Storyblok
  • Square Enix

Showcase: https://madewithsvelte.com

But React still owns the job market. Svelte is growing fast but isn’t yet the default choice for enterprises. You'll still find far more React roles than Svelte roles.

Downsides I’ve Personally Experienced

SvelteKit is great, but here are the actual issues I’ve run into:

  1. Random white screens during development Usually caused by Vite HMR crashes. Not a Svelte issue, but it happens.

  2. Smaller ecosystem If you need a niche React-only library, you're on your own. The ecosystem is growing, but React is still miles ahead.

None of these are dealbreakers, just things worth knowing before switching.

Final Thoughts

SvelteKit feels like what frontend development should have always been. Closer to the platform. Less boilerplate. More readable code. Smaller bundles. Simpler mental model.

React is still great. Next.js is still great. But SvelteKit made me realize we might have accepted complexity for too long.

If you're bored, curious, or tired of boilerplate, SvelteKit is absolutely worth trying.