Not able to understand the effect function: speed up, slow down example in Svelte5 documentation

Svelte5 introduces effect function. On the documentation page there is an example of a simple counter with an option to increase / decrease the interval using setInterval function.

Here is the code:

<script>    let elapsed = $state(0);    let interval = $state(1000);    $effect(() => {        const id = setInterval(()=>{            elapsed += 1;        }, interval)    });</script><button onclick={() => interval /= 2}>speed up</button><button onclick={() => interval *= 2}>slow down</button><p>elapsed: {elapsed}</p>

When we click the speed up button the interval gets updated and the new counter runs fast.

However, when we click the slow down button, the interval gets updated but the speed doesn't reduce.

The explanation given on the doc page is as follows:

That’s because we’re not clearing out the old intervals when theeffect updates. We can fix that by returning a cleanup function:

Now the question is that when we are not clearing out the old intervals then the speed up should also not work.

Why do we have a case where speed up is working but slow down is not working when both lead to change of state i.e. interval value.