Why SvelteKit Is My Frontend Framework of Choice

I have used React for years. It is the industry standard, and it works. But it always felt like I was fighting the framework. Too much boilerplate. Too many abstractions. Too many ways to do the same thing.

Then I tried SvelteKit.

The mental model

React thinks in components and state. Svelte thinks in markup and reactivity. In Svelte, you write HTML, CSS, and JavaScript in one file. When a variable changes, the DOM updates automatically. No hooks, no useEffect, no complex state management.

Less code

A simple counter in React:

import { useState } from 'react';

function Counter() {
  const [count, setCount] = useState(0);
  return <button onClick={() => setCount(count + 1)}>{count}</button>;
}

The same in Svelte:

<script>
  let count = 0;
</script>
<button on:click={() => count++}>{count}</button>

Less code means fewer bugs.

Full-stack by default

SvelteKit includes:

• File-based routing
• Server-side rendering
• API endpoints
• Form handling
• Image optimization

You do not need to wire together a dozen tools. It just works.

Performance

Svelte compiles to vanilla JavaScript at build time. There is no virtual DOM. No framework overhead in the browser. The result is smaller bundles and faster apps.

When I still use React

Some projects require React. Some teams only know React. Some libraries only support React. But for my own projects, I reach for SvelteKit.

Getting started

If you haven’t tried SvelteKit, I recommend it. Run npm create svelte@latest my-app and see how simple it feels.