Infinite loop and dev server and ssr freezes

[sinbino]

Describe the bug

Bindings between components may cause an infinite loop of updates. Although simplified in the reproduction repository, in reality they often occur in a larger number of component combinations, and the lack of errors and warnings makes it difficult to identify the cause or bad pattern.

update: Actual situations may occur in situations that are more complex than a reproduction repository. The dev server does not produce any errors, it simply freezes and developers tend to waste time trying to locate it. svelte is a great tool. But this is clearly not a "fast" and "fun" developer experience. I think it would be better to at least output an error or warning in situations like this where freezes occur.

update: Freezes occur not only on the dev server, but also during the SSR process in the production build.

Reproduction

https://github.com/sinbino/issue-sveltekit-reactive See repository above.

src/routes/test/Component0.svelte

<script lang="ts">
  import Component1 from './Component1.svelte'

  export let data = { value: undefined }

  let value: any = undefined
  const setValue = (v: any) => { 
    value = v
    console.log('UPDATE!')
  }
  $: { setValue(data.value) }
</script>

<Component1 bind:value></Component1>

src/routes/test/Component1.svelte

<script lang="ts">
  export let value: any = ''
</script>

<input bind:value />

The setValue function of Component0.svelte is executed infinitely. This only occurs when SSR occurs.

Logs

No response

System Info

System:
    OS: Linux 5.15 Ubuntu 22.04.1 LTS 22.04.1 LTS (Jammy Jellyfish)
    CPU: (10) x64 Intel(R) Core(TM) i5-10600 CPU @ 3.30GHz
    Memory: 5.36 GB / 14.18 GB
    Container: Yes
    Shell: 5.1.16 - /bin/bash
  Binaries:
    Node: 18.12.1 - /usr/bin/node
    Yarn: 1.22.19 - /usr/bin/yarn
    npm: 8.19.2 - /usr/bin/npm
  npmPackages:
    svelte: ^3.54.0 => 3.55.1

Severity

annoyance

[BlackxSnow]

I've just run into this issue and I'm honestly quite confused still. Why does the reactive statement infinitely run? It should only be dependent on data.value, which is never modified in the repro.

You refer to it as a "bad pattern" - is there a preferred way of achieving the same functionality?

I've also noticed that neither $: console.log(data.value); nor $: console.log(value) appear to cause the issue. Neither does

function Update(d)
{
    if (!d) return;
    value = d.value;
}
$: Update(data);