After diving deep into Svelte 5 runes I can say confidently that derived can do 99% of the reactive state functionality required. Effect is hardly ever needed. - ThreadSky

mikek.me • 64 days ago

After diving deep into Svelte 5 runes I can say confidently that derived can do 99% of the reactive state functionality required.

Effect is hardly ever needed.

Comments

bhidesvelte.bsky.social•64 days ago

yeep totally agree...
here are more utilities for Svelte 5

https://runed.dev/docs
it might help you for example, watch, context etc..

mikek.me•64 days ago

oh good point, I haven't checked the runed docs in forever.

watch is actually awesome, even less reason to use effect!

vagabond-software.bsky.social•64 days ago

How are you handling things like focusing / scrollIntoView elements, binding 0 to many elements to a variable, posting to web workers, bind/unbind state based hotkeys, syncing state with 3rd party libs; on state change?

Just curious, posts like this make me feel like I'm doing something wrong lol.

mikek.me•64 days ago

Maybe focusing or scrollintoView could be handled by onMount (in svelte specifically) but the others are definitely a good use case for effect.

My point was more just mundane state changes that can get more complex don't need effects, just more complex derived functions.

vagabond-software.bsky.social•64 days ago

In regards to mundane state changes that become more complex. Would populating state via an async call on the client fall under that category? - Is there a way derived would solve this, if you had to load from the client?

Genuinely curious. If it can be done better I'd rather do it that way.

thiagolino8.bsky.social•63 days ago

Effects are often necessary for asynchronous operations for many reasons, especially cleanup
But for the case you exemplified $derived seems to be enough
https://svelte.dev/playground/91e5a47ce72746099c5923e4427dfa36?version=5.25.12

vagabond-software.bsky.social•63 days ago

Thanks for the example!

Maybe it's just because its a quick POC. - [svelte] assignment_value_stale is logged on each change. And query on line 12 of createResource is marked with state_referenced_locally warning.

thiagolino8.bsky.social•63 days ago

Well, they are just warnings, not errors.
Their purpose is to warn about some behavior that is probably not desired, in this case it is.
The warnings are not relevant in this case

mikek.me•64 days ago

Interestingly was looking into something exactly like this implementation and was directed to this custom rune called resource

https://runed.dev/docs/utilities/resource

vagabond-software.bsky.social•63 days ago

Yeah I think the Runed library is pretty cool!

As far as I can tell resource uses watch, which uses effect, under the hood :)

I think my particular app just has a lot of use cases for effect (or an effect wrapper). But I see this take so much it makes me doubt myself haha 😅

thiagolino8.bsky.social•64 days ago

Additions like createSubscriber and mutable derived have eliminated many of the usages that required $effect
The only thing missing to eliminate $effect for good now is a primitive to handle asynchronous state atomically

paolo.ricciuti.me•64 days ago

100% this

mindplay.dk•64 days ago

isn't that true of any framework?

people certainly seem to abuse effects in React more than anywhere

but it's usually all fixable, which makes me think the issue is more cultural than technical 🤔

thiagolino8.bsky.social•64 days ago

use effect gets a lot of hate, but the truth is that for a long time React didn't have the APIs needed to handle many issues, especially external state
That's why useEffect was the tool to solve everything (in a poor way)

mindplay.dk•64 days ago

it gets hate because it's often (even usually) used to manage internal state - things you could have correctly handled with memos

you never needed useEffect for that

it has very few "legit" use cases where state is actually "leaving" React's state management 🙂

thiagolino8.bsky.social•63 days ago

But it was also the only way to do the work that is now done by:
useSyncExternalStore
useOptimistic
callback refs with cleanup
useDeferedValue
use

All added in the last 2 versions
Before that there was only useEffect

mindplay.dk•63 days ago

really the main problem I was referring to is simply that of thinking useEffect is just for "responding to state changes", which usually means calling setState from useEffect

I mean even for simple domain logic, not even for syncing with anything external

entire codebases built like that. "fun" 🥴

Comments

Posting Rules

Reply