Performance issues when unmounting useLiveQuery due to excessive garbage collection timers
I am currently building a monthly table in React with TanstackDB and ElectricSQL. The parent component itself makes a query for the data on the table, passes down primitives for optimal memoization and then each cell does their own sub-query to get only the data they need.
The tabel has just shy of a thousand cells and each cell can have two queries in it. Initial render times are not the worst, but what I noticed was that when unmounting the table due to a change in a filter or due to page unloads, it takes about 4.5 seconds to unload it!
I tried hunting down the issue a bit more and it seems the reason is the garbage collection timers. In
Ideally, the garbage collection should be deferred with setTimeout only once. It seems each live query will trigger their own
The tabel has just shy of a thousand cells and each cell can have two queries in it. Initial render times are not the worst, but what I noticed was that when unmounting the table due to a change in a filter or due to page unloads, it takes about 4.5 seconds to unload it!
I tried hunting down the issue a bit more and it seems the reason is the garbage collection timers. In
startGCTimerstartGCTimercreateLiveQueryCollectionIdeally, the garbage collection should be deferred with setTimeout only once. It seems each live query will trigger their own
setTimeout
