Component lifecycle timing changed in 5.36 causing subscription overlap issues

[harshmandan]

Describe the bug

A weird lifetime cycle bug has appeared in v5.36 onwards causing all sort of weird rendering issue in my app. It seems like the unmounting/subscription order for stores has changed causing overlaps and resulting in slowdown and rendering issues in the app.

I've created a reproduction that you can check out. Here's a video of how the issue looks like:
v5.35

v5.35.mp4

v5.38

v5.38.mp4

Reproduction

The logs below show the changed order of lifecycle in the new version.

---

There are a few moving parts so I created the repository with the least things I could:

https://github.com/harshmandan/svelte-lifecycle-bug-reproduction

To see the bug in action yourself, change svelte version to v5.36+ and run the dev server.

1. Go to folder view, then click on any video item.
2. Then keep going back and forth between folder and item.
3. You'll see the un-subscription of the clicked video item happens AFTER the list subscription happens. In v5.35, the un-subscription happens FIRST and then the new subscription for listing items follows.

Logs

These logs are from the browser console

In v5.35

========== NAVIGATING TO VIDEO ==========

+page.svelte:31 🔴 [Folder Page] Destroyed
+layout.svelte:24 🔴 [Workspace Layout] Destroyed
db.ts:71 📕 [Firestore UNSUBSCRIBE] Ending query
db.ts:83 📖[Firestore SUBSCRIBE] Document: video1
+page.svelte:14 🟢 [Video Page] Mounted
+layout.svelte:5 [Studio Layout] Mounted
+page.svelte:37 
========== NAVIGATING BACK TO FOLDER ==========

+page.svelte:18 🔴 [Video Page] Destroyed
db.ts:104 📕 [Firestore UNSUBSCRIBE] Document: video1 <<<< UNSUBSCRIBED FIRST
+layout.svelte:9 [Studio Layout] Destroying
workspaceContext.ts:7 🏢 [WorkspaceContext] Created
db.ts:50 📖 [Firestore SUBSCRIBE] Starting query <<<< NEW SUBSCRIPTION AFTER

In v5.38

========== NAVIGATING TO VIDEO ==========

db.ts:83 📖[Firestore SUBSCRIBE] Document: video1
+page.svelte:31 🔴 [Folder Page] Destroyed
+layout.svelte:24 🔴 [Workspace Layout] Destroyed
db.ts:71 📕 [Firestore UNSUBSCRIBE] Ending query
+page.svelte:14 🟢 [Video Page] Mounted
+layout.svelte:5 [Studio Layout] Mounted
+page.svelte:37 
========== NAVIGATING BACK TO FOLDER ==========

workspaceContext.ts:7 🏢 [WorkspaceContext] Created
db.ts:50 📖 [Firestore SUBSCRIBE] Starting query <<<< NEW SUBSCRIPTION FIRST
+layout.svelte:16 🏢 [Workspace Layout] 165 items
+page.svelte:18 🔴 [Video Page] Destroyed
db.ts:104 📕 [Firestore UNSUBSCRIBE] Document: video1 <<<< UNSUBSCRIBED AFTER

System Info

System:
    OS: macOS 15.6
    CPU: (8) arm64 Apple M1 Pro
    Memory: 70.77 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.15.0 - ~/.nvm/versions/node/v22.15.0/bin/node
    npm: 10.9.2 - ~/.nvm/versions/node/v22.15.0/bin/npm
    pnpm: 10.11.0 - ~/.nvm/versions/node/v22.15.0/bin/pnpm
    bun: 1.1.6 - /opt/homebrew/bin/bun
  npmPackages:
    svelte: 5.38.0 => 5.38.0
    svelte: 5.36.0 => 5.36.0

Severity

blocking all usage of svelte