Why does mutating arrays or objects sometimes not update a Svelte 3/4 component?

In Svelte 3 and 4 reactivity is triggered by assignment to the variable the compiler tracks. Mutating an array or object in place does not notify the compiler because no assignment occurs.

<script>
  let items = [1, 2, 3];
  function add() {
    items.push(4);          // no update
    items = items;          // hacky, but triggers
    items = [...items, 4];  // idiomatic
  }
</script>

Use the spread operator or concat, filter and map to produce new arrays, or reassign properties into a new object, for example obj = { ...obj, key: value }. Nested component props also only update when the reference changes, so immutable updates are the norm.

Svelte provides $: reactive statements to recompute derived values when dependencies are assigned. With Svelte 5 $state, arrays and objects are deep proxies, so items.push(4) does update the UI. The runes model removes this common pitfall while keeping assignment intuition for primitives.