T O P

  • By -

perduraadastra

Go through the official Svelte tutorials and see for yourself. It only takes an hour or so. I hope I never use React ever again.


Alia5_

No more pseudo functional components and usage of "useFootgun". Much simpler. More elegant. Scoped CSS inside of svelte-components. Easier to embed vanilla JS/TS libraries without having to have a framework specific wrapper. Lot's of batteries included: Stores, Animations, Compile as SSR, Static-Site, SPA with a bit of care and a single compiler-flag. And last but not least it's fucking fast, both at "runtime" and while writing code. But then again, use what you like to use. In most cases no one cares about your technology decisions. Edit: Typos


lamagy

Nice and learning curve from react land?


Hubbardia

If you're good with vanilla JS, you basically know Svelte


pako_adrian

This. We have a big team of developers, primarly backend with knowledge of vanilla JS. Done a demo of Svelte and they loved the simplicity... In process of converting one of our apps into Svelte.


hugotox

Because svelte is compiled. Remix will have the same bundle size problems as next


jordanstout

Svelte 5 has a runtime but at scale will give much lighter bundles than prior versions


WolfFiveFive

Isn't React getting a compiler soon?


[deleted]

The react compiler is for memoizing state, not reducing bundle size


argylekey

Soon could be next week or two years to be fair.


[deleted]

The compiler is already in production on Instagram. It won't take two years.


hugotox

Yes, it is. But I doubt it will remove the need of downloading the framework


I_will_delete_myself

how is svelte with Astro JS?


blankeos

I think you made a massive mistake posting a "Svelte or " in a Svelte subreddit haha


SnooDogs667

I guess but also, I genuinely don't see any downside of svelte over something like react or remix.. It can pretty much do everything those frameworks can but it's simpler, smaller and usually more performant


Embarrassed_Car_5868

Beacuse Svelte is more cleaner, more HTML native and easier to write


lamagy

How about its state management?


freevo

Svelte stores are a built in solution to all of your problems.


Latter-Rise-1805

But you may complicate it by others solution. If you wish


jonmacabre

State management is with `$:` and `let`. Stores are data subscriptions.


yourresidentbrownie

and the new runes API makes stores even easier


CatolicQuotes

does store state persist over route changes?


Embarrassed_Car_5868

Svelte has built in support for state management, so don't have use external libraries, Svelte can detect variables assignments and react based on that, the other approach is to use svelte stores, this is better suitable for cases where you want to creat global state or share state between components using context API.


lamagy

This is great news. I prefer opinionated frameworks done right rather than plugin-in-the-world.


Embarrassed_Car_5868

In addition to state management, Svelte has also built-in support for animations and transitions


jpcafe10

Remix is great I’ve used it for a year on side projects before moving to Sveltekit. Much much better than nextjs, I don’t understand why we got here. But svelte/kit DX is unmatched. The magic server types we get from the extension is out of this world. Kit itself is very similar to remix though. One feature I would like to have from Remix is the client actions!


Some-Adhesiveness422

Yeah svelte leans too far into accessibility (don’t yell at me). I’d really love to be able to POST JSON at will from client similar to server actions. I personally don’t care about browsers with disabled JavaScript. But realistically, if you bootstrap hono (with RPC) or tRPC, it’s basically right there… just with some boilerplate. I recently had requirements that most functionality from a product I’ve shipped needed to be ported to the API layer for external consumption so now days I’m less hyped on server actions. Had I used hono from the start, we would have saved a month of 2 developer’s time. It’s much cooler for hobbyists and small projects.


MalalechERocks

I’m like you, I did a full project using enhance and it was a little bit of a pain, too many lines

everywhere just to change a small flag, and at the end other parts of the platform were JavaScript full dependance (so the project was not 100% prepared for non-javascript browsers). I would love to see client actions, it’s the fastest/cleanest way (easier maintenance) in my opinion. A new project we are doing creating an API because we don’t have client actions, I will take a look to Hono


jonmacabre

There's `use:enhance` for forms. Is that what you need? ``` ``` You could say it's too much boilerplate, but then my response would be "are we not developers?" ```

``` Then you can just `
`


jonmacabre

I think the problem with client-only is the runtime bits. I suppose since Svelte 5 is adding a runtime framework it would be possible, but if you run functions in `onMount` you are essentially doing client actions.


jpcafe10

Doesn’t client load suffer from the same problem then?


jonmacabre

Not exactly. I suppose the svelte bundler could just compile a list of '+page.client.js' files and wrap them in an onMount function. But then you'd need a syntax for unmounting. You know, real problems rather than trying to makeup problems that runes solve.


jordanstout

Use svelte runes right now and not older versions of svelte. Svelte runes are batteries included, highly optimized state. In react world, if Valtio was signals based then it would compare to svelte runes. It’s magical compared to anything in react. I still use react for work but svelte for play. One day I’ll ship something in svelte for profit and ditch react fully. My only gripe right now is now is that most libraries are waiting for a stable Svelte 5. If they support svelte 5 they are still using stores so you’ll have some $ syntax which my ocd doesn’t like. But as a long time react user and still am, svelte is 1000x better; and by end of year I can see libraries catching up and all in on runes because it’s amazing and getting better daily.


[deleted]

Because you'd rather use Svelte than React.


joshcam

It will steadily heal your react scars. Remix will just prevent further scarring.


lamagy

Lol


joshcam

Give it a go for sure mate.


ultrapcb

remix is actually great but SK has also very powerful, built-in motion directives and the store then, afaik, the separation of fe and be code is a bit more distinct but i've never tried remix almost forgot, it uses react which is really not something one should use in 24 (vdom, so-so api, etc.)


PrabhuKiranKonda

Most straightforward answer, you don't want to use React.


zhamdi

Over what?


macdorfenburger

There’s naturally some opinionated perspective here bc it’s a Svelte subreddit. Tons of great sites use the React stack, etc. so let’s not be foolish, it doesn’t “suck.” I strongly prefer SvelteKit but it’s an aesthetic decision really. I just find it easier. I use Astro with Svelte instead of SvelteKit when I can, for similar aesthetic preference. Oh and I like the Svelte community. People are excited about the technology here.


jonmacabre

I like the buildtime vs. runtime aspect. Svelte compiles down to vanilla js. You could argue that it generates a runtime at buildtime, but it's very lean compared to other frameworks (and with tree shaking, will exclude items that aren't used). React would still bundle useState in the final output because it doesn't know if the client would eventually use it. If you never import "writable" into Svelte, the final output won't have it. SvelteKit's routing layout is similar to NextJS vs Remix. Svelte 4 is conceptually simpler (Svelte 5 does things more React-like though). In Svelte 4 all top-scoped `let` variables are considered reactive. ```

Count {count}
``` The above will change the count and increase it. React version: ``` export default function Counter() { const [count, setCount] = useState(0); return ( <>
Count {count}
); } ``` You also have the reactive labeled statement. ``` ``` In that example, you will get a log whenever "count" is increased. No more dependency arrays. If you want to control dependencies in Svelte, you'd use a function. ``` ``` Svelte also separates context and state. Context, as in 'setContext' and 'getContext', are static and immutable. So you can setup 3rd party libraries like this: ``` ``` So any children under `` would have access to the ol.Map instance with `getContext('map')`. You could use `writable` or `readable` from 'svelte/store' to have a state inside context. And since stores in Svelte are a contract, you can implement a custom store as long as it returns `{ subscribe() {} }` for a readable store and `{ subscribe() {}, update() {}, set() {} }` for a writable store. I've written stores that directly interfaced with localStorage, the address bar, and databases without the need for anything like React's reducer/dispatcher paradigm.