refactor: cacheTime-zero

apply a different suspense "workaround": do not garbage collect when fetching optimistically (done only by suspense) - gc will kick in once an observer subscribes; this will make sure we can still gc other fetches that don't have an observer consistently, like prefetching when the fetch takes longer than the gc time (which was leaking with the old workaround)

Author: TkDodo

src/core/query.ts

@@ -35,6 +35,7 @@ interface QueryConfig<
   cache: QueryCache
   queryKey: TQueryKey
   queryHash: string
+  optimistic?: boolean
   options?: QueryOptions<TQueryFnData, TError, TData, TQueryKey>
   defaultOptions?: QueryOptions<TQueryFnData, TError, TData, TQueryKey>
   state?: QueryState<TData, TError>
@@ -154,20 +155,19 @@ export class Query<
   revertState?: QueryState<TData, TError>
   state: QueryState<TData, TError>
   meta: QueryMeta | undefined
+  isFetchingOptimistic?: boolean
 
   private cache: QueryCache
   private promise?: Promise<TData>
   private retryer?: Retryer<TData, TError>
   private observers: QueryObserver<any, any, any, any, any>[]
   private defaultOptions?: QueryOptions<TQueryFnData, TError, TData, TQueryKey>
   private abortSignalConsumed: boolean
-  private hadObservers: boolean
 
   constructor(config: QueryConfig<TQueryFnData, TError, TData, TQueryKey>) {
     super()
 
     this.abortSignalConsumed = false
-    this.hadObservers = false
     this.defaultOptions = config.defaultOptions
     this.setOptions(config.options)
     this.observers = []
@@ -177,7 +177,6 @@ export class Query<
     this.initialState = config.state || this.getDefaultState(this.options)
     this.state = this.initialState
     this.meta = config.meta
-    this.scheduleGc()
   }
 
   private setOptions(
@@ -200,7 +199,7 @@ export class Query<
     if (!this.observers.length) {
       if (this.state.fetchStatus === 'idle') {
         this.cache.remove(this)
-      } else if (this.hadObservers) {
+      } else {
         this.scheduleGc()
       }
     }
@@ -307,7 +306,6 @@ export class Query<
   addObserver(observer: QueryObserver<any, any, any, any, any>): void {
     if (this.observers.indexOf(observer) === -1) {
       this.observers.push(observer)
-      this.hadObservers = true
 
       // Stop the query from being garbage collected
       this.clearGcTimeout()
@@ -451,8 +449,10 @@ export class Query<
         // Notify cache callback
         this.cache.config.onSuccess?.(data, this as Query<any, any, any, any>)
 
-        // Remove query after fetching
-        this.scheduleGc()
+        if (!this.isFetchingOptimistic) {
+          // Remove query after fetching
+          this.scheduleGc()
+        }
       },
       onError: (error: TError | { silent?: boolean }) => {
         // Optimistically update state if needed
@@ -471,8 +471,10 @@ export class Query<
           getLogger().error(error)
         }
 
-        // Remove query after fetching
-        this.scheduleGc()
+        if (!this.isFetchingOptimistic) {
+          // Remove query after fetching
+          this.scheduleGc()
+        }
       },
       onFail: () => {
         this.dispatch({ type: 'failed' })

src/core/queryObserver.ts

@@ -309,17 +309,13 @@ export class QueryObserver<
 
     const query = this.client
       .getQueryCache()
-      .build(
-        this.client,
-        defaultedOptions as QueryOptions<
-          TQueryFnData,
-          TError,
-          TQueryData,
-          TQueryKey
-        >
-      )
+      .build(this.client, defaultedOptions)
+    query.isFetchingOptimistic = true
 
-    return query.fetch().then(() => this.createResult(query, defaultedOptions))
+    return query.fetch().then(() => {
+      query.isFetchingOptimistic = false
+      return this.createResult(query, defaultedOptions)
+    })
   }
 
   protected fetch(
@@ -655,17 +651,7 @@ export class QueryObserver<
   }
 
   private updateQuery(): void {
-    const query = this.client
-      .getQueryCache()
-      .build(
-        this.client,
-        this.options as QueryOptions<
-          TQueryFnData,
-          TError,
-          TQueryData,
-          TQueryKey
-        >
-      )
+    const query = this.client.getQueryCache().build(this.client, this.options)
 
     if (query === this.currentQuery) {
       return