Reactive bug with bind: triggering multiple reactions

[gregg-cbs]

Describe the bug

I am using a svelte store with a file state.svelte.ts and it seems when any state in there changes it is causing rerender off all components that use any piece of that state instead of just rerendering the component that is using the changed piece of state.

This feels like a bug and I was able to replicate it to show you. Let me know why this behaviour is happening and how to get around it.

Reproduction

You can find a REPL here that shows this behavior, check the console logs:
https://svelte.dev/playground/1f9b186ca4f840b3b7a8991c58660b1a?version=5.28.2

System Info

Windows, Firefox

Severity

annoyance

[MotionlessTrain]

That is because the App.svelte is not in runes mode. It falls back on svelte 4’s reactivity, which is not fine-grained, so the entire class object is invalidated
If you add <svelte:options runes={true} />, it works as expected

[gregg-cbs]

Right so in my svelte config i have to force it to runes mode? is it like this?

const config = {
  compilerOptions: {
    runes: true
  }
}

I assumed svelte 4 came with Runes enabled and you had to opt out. I think projects set up through the CLI should have runes set to true automatically. If i had not done a console log in $effect i would never have known my app was doing all these crazy rerenders.

[gregg-cbs]

Marking this as solved. Thank you for you help!

[MotionlessTrain]

Right so in my svelte config i have to force it to runes mode?

That might break svelte libraries which use svelte 4 syntax. By using runes in a svelte file, or using <svelte:options runes={true} />, you can enable it per component, which is safer

I assumed svelte 4 came with Runes enabled and you had to opt out. I think projects set up through the CLI should have runes set to true automatically. If i had not done a console log in $effect i would never have known my app was doing all these crazy rerenders.

They are disabled by default (to make migrating easier) and enabled in aforementioned cases. Same holds true for the CLI, so you can still test legacy syntax there, and the migration tool

[gregg-cbs]

Yeah it broke a few packages.. but i cloned those and made the alterations myself. Some libraries i ditched. All is running now and super super superrrrrr quick!

I appreciate your time and response.