Preload hanging / Collection lifecycle bug

[fcannizzaro]

Hi, I'm having an issue with the collection.preload():

stack: TanStack Start + TanStack DB + Electric

After keeping a page open for a while, when switching routes the next route remains in "pending" status because the preload() call never finishes.

export const Route = createFileRoute("/_main/alerts")({
  component: RouteComponent,
  loader: async () => {
    // console.log("before preload");
    await collection.preload();
    // console.log("after preload"); <-- unreachable when broken
  },
});

Observations
• If the page is left in the background for 5–10 minutes, many collections break.
• When this happens, collection.preload() hangs indefinitely.

Also it seems to happen more frequently on 1.1.1+ electric (idk why).

Possible correlation (not 100% sure):
• the latest Electric network call gets canceled
• after that, no more network calls are made for that collection
• If they resume, the collection is still empty (even though previously was not empty)

As @samwillis said on discord maybe it can be some problem of the lifecycle management of the collection (and the related GC)

repo to reproduce the issue
https://github.com/fcannizzaro/ts-db-electric-preload-issue/tree/main