Svelte 5: When spread object passed to components changes all the output of $props is updated instead of only the necessary stuff about svelte HOT 6 CLOSED

Interestingly the order of the props matters: repl

from svelte.

but aren't props like open or about primitives? shouldn't it run when the value changes? there is no mention of the parent object inside the $effect.

What I mean is this:

<Child open={true} {...rest} />
<button onclick={()=> rest = { open: false }}>change</button>

So if inside the effect you access open you have an implicit dependency on the object because it the object changes open could change

from svelte.

@trueadm Here's another example of a problem I think has to do with the same thing and it's weird.
Lets say we have the following component.
Test.svelte

<script lang="ts">
  import { onMount } from "svelte";

  let { open = $bindable(false), about, somethingElse }: { open?: boolean; about?: string; somethingElse?: number } = $props();

  // $inspect(open);
  $effect(() => {
    console.log(open);
  });

  onMount(() => {
    setTimeout(() => {
      open = true;
    }, 3000);
  });
</script>

And this is our +page where I'm simulating the spreading of 2 different objects based on a condition.

<script lang="ts">
  import Test from "$components/Test/Test.svelte";
  import { onMount } from "svelte";

  let boolVar = $state(false);
  onMount(() => {
    setTimeout(() => {
      boolVar = true;
    }, 5000);
  });
</script>

<Test {...boolVar ? {} : { about: "hello", somethingElse: 2 }}></Test>

Now after 3 seconds, we are simulating a change from inside Test that sets open to true, then wait for the setTimeout inside page to change the boolVar variable. You will notice that the variable open which was not even in the spreaded object, retakes its default value, meaning it changes back to false.
Now if you change the $effect with an inspect then something else happens. Even though the reactivity is triggered and $inspect runs again, this time the value of open remains true.

from svelte.

Just to clarify the behaviour: the reason effects rerun when you reassign a spread is because they need to check if the new shape of the object is overriding a prop. In my PR I limited this by listening to a derived of the keys of the object so that it's only rerunning when the keys change.

However it would still need to rerun in both cases you proposed.

from svelte.

but aren't props like open or about primitives? shouldn't it run when the value changes? there is no mention of the parent object inside the $effect.
still, it shouldn't cause open to take its default value again.

from svelte.

After discussion, we decided against merging #11290 — this is one of those cases where the cure (creating extra derived signals indiscriminately) is worse than the disease (effects occasionally overfiring). Effects should generally be idempotent, meaning it doesn't matter if they overfire, and in the cases where it does matter you can create a derived locally to work around the problem.

The case where a prop is reset to its default value is admittedly trickier. But #11290 doesn't actually solve it, it only mitigates it, because you could easily have a situation where the keys of the spread prop change.

If we want to fix that, I think we would need to have a new rule along the lines of 'if an unbound prop was changed locally, it won't be reset to the fallback value if the parent changes it to undefined'.

from svelte.