Svelte store subscriptions leaking after component unmount when subscribing manually in onMount

Answer the exact question first

1. Is returning the unsubscribe function from onMount the documented and sufficient pattern?

Yes. In Svelte 4 the onMount helper accepts a callback that can return a cleanup function. That cleanup is executed automatically when the component is destroyed, so you can write:

import { onMount } from 'svelte';
import { myStore } from './stores.js';

onMount(() => {
  const unsubscribe = myStore.subscribe(value => {
    // react to value
  });
  return () => unsubscribe(); // cleanup on unmount
});

This is the officially documented way (see the Svelte 4 docs under onMount) and is equivalent to calling onDestroy(() => unsubscribe());. Returning the function is concise and guarantees the subscription is torn down when the component leaves the DOM.

2. Is there a supported way to verify at runtime that all subscriptions were released after unmount, short of heap profiling?

• Insert a console.log inside the subscription callback and confirm it stops firing after the component is removed.
• In dev mode you can also enable the --check-usage flag in the Svelte compiler to catch unused stores, though it does not detect live leaks.
• Use the browser’s Memory panel to take a snapshot before mounting and after unmounting; a retained closure that references the callback indicates a leak.

There is no built‑in runtime assertion that a store has been unsubscribed; the framework simply relies on the cleanup you provide.

3. Does a leaked subscription cause any observable warning in development mode, or is it always silent?

Leaked subscriptions are silent. Svelte does not emit a warning if a subscription callback continues to run after the component has been destroyed. You may see errors if the callback tries to manipulate DOM nodes that no longer exist, but otherwise the leak will not be reported.

Practical checklist for manual subscriptions

1. Subscribe in onMount (or any lifecycle hook) and store the returned unsubscribe function.
2. Return that function from the onMount callback, or call it in onDestroy.
3. Verify by adding a log or using devtools memory snapshots.
4. If you use derived stores that internally subscribe to other stores, remember that unsubscribing from the outer store automatically tears down the inner subscriptions.

Using the return form keeps your component code compact and eliminates the risk of forgetting to clean up. If you prefer explicit cleanup, onDestroy works just as well.

Ask for missing diagnostic detail

If you are subscribing to a derived store that internally listens to other stores, let me know, because the unsubscribe chain can be slightly different.