feat: remove memos (React Compiler)

.github/workflows/main.yml

@@ -19,7 +19,7 @@ jobs:
       - name: Setup Node.js
         uses: actions/setup-node@v4
         with:
-          node-version: 24.0.0
+          node-version: 25.0.0
           cache: 'npm'
           cache-dependency-path: package-lock.json
 
@@ -39,7 +39,7 @@ jobs:
       - name: Setup Node.js
         uses: actions/setup-node@v4
         with:
-          node-version: 24.0.0
+          node-version: 25.0.0
           cache: 'npm'
           cache-dependency-path: package-lock.json
 
@@ -59,7 +59,7 @@ jobs:
       - name: Setup Node.js
         uses: actions/setup-node@v4
         with:
-          node-version: 24.0.0
+          node-version: 25.0.0
           cache: 'npm'
           cache-dependency-path: package-lock.json
 
@@ -81,7 +81,7 @@ jobs:
       - name: Setup Node.js
         uses: actions/setup-node@v4
         with:
-          node-version: 24.0.0
+          node-version: 25.0.0
           cache: 'npm'
           cache-dependency-path: package-lock.json
 

.nvmrc

@@ -1 +1 @@
-24
+25

package.json

@@ -107,6 +107,7 @@
     "prettier": "^3.6.2",
     "react": "^19.1.1",
     "react-dom": "^19.1.1",
+    "react-error-boundary": "^6.0.0",
     "solid-js": "^1.9.9",
     "typescript": "~5.9.3",
     "typescript-eslint": "^8.46.2",

src/react/components/QueryPrefetchTags.tsx

@@ -1,6 +1,5 @@
 import type { QueryInstance } from 'query/react:hooks/useQueryInstance'
 import type { ReactNode, LinkHTMLAttributes } from 'react'
-import { useMemo } from 'react'
 import { useQueryPrefetch } from 'query/react:hooks/useQueryPrefetch'
 
 type Additional = LinkHTMLAttributes<HTMLLinkElement> & QueryInstance
@@ -13,12 +12,7 @@ export interface QueryPrefetchTagsProps extends Additional {
 export function QueryPrefetchTags({ keys, children, ...options }: QueryPrefetchTagsProps) {
   useQueryPrefetch(keys, options)
 
-  const tags = useMemo(
-    function () {
-      return keys.map((key) => <link rel="preload" href={key} as="fetch" {...options} />)
-    },
-    [keys, options]
-  )
+  const tags = keys.map((key) => <link rel="preload" href={key} as="fetch" {...options} />)
 
   return (
     <>

src/react/components/QueryProvider.tsx

@@ -1,6 +1,6 @@
-import { useEffect, useMemo, type ReactNode } from 'react'
+import { useEffect, type ReactNode } from 'react'
 import { Context, type ContextValue } from 'query/react:context'
-import { createQuery, type Query } from 'query:index'
+import { createQuery } from 'query:index'
 
 export interface QueryProviderProps extends ContextValue {
   children?: ReactNode
@@ -12,12 +12,7 @@ export function QueryProvider({
   ignoreTransitionContext,
   query,
 }: QueryProviderProps) {
-  const localQuery = useMemo<Query>(
-    function () {
-      return query ?? createQuery()
-    },
-    [query]
-  )
+  const localQuery = query ?? createQuery()
 
   useEffect(
     function () {
@@ -35,12 +30,7 @@ export function QueryProvider({
     [localQuery]
   )
 
-  const value = useMemo(
-    function (): ContextValue {
-      return { query: localQuery, clearOnForget, ignoreTransitionContext }
-    },
-    [localQuery, clearOnForget, ignoreTransitionContext]
-  )
+  const value = { query: localQuery, clearOnForget, ignoreTransitionContext }
 
   return <Context value={value}>{children}</Context>
 }

src/react/components/QueryTransition.tsx

@@ -1,5 +1,5 @@
-import { TransitionContext, type QueryTransitionContextValue } from 'query/react:transition'
-import { useMemo, type ReactNode, type TransitionStartFunction } from 'react'
+import { TransitionContext } from 'query/react:transition'
+import { type ReactNode, type TransitionStartFunction } from 'react'
 
 export interface QueryTransitionProps {
   isPending: boolean
@@ -8,12 +8,7 @@ export interface QueryTransitionProps {
 }
 
 export function QueryTransition({ children, startTransition, isPending }: QueryTransitionProps) {
-  const value = useMemo(
-    function (): QueryTransitionContextValue {
-      return { startTransition, isPending }
-    },
-    [startTransition, isPending]
-  )
+  const value = { startTransition, isPending }
 
   return <TransitionContext value={value}>{children}</TransitionContext>
 }

src/react/hooks/useQuery.ts

@@ -1,4 +1,3 @@
-import { useMemo, useDebugValue } from 'react'
 import { type ContextValue } from 'query/react:context'
 import { type Options } from 'query:index'
 import { type QueryInstance } from './useQueryInstance'
@@ -16,16 +15,9 @@ export interface Resource<T = unknown> extends AdditionalHooks<T> {
 export type ResourceOptions<T = unknown> = ContextValue & Options<T> & QueryInstance
 
 export function useQuery<T = unknown>(key: string, options?: ResourceOptions<T>): Resource<T> {
-  useDebugValue('useQuery')
-
   const basic = useQueryBasic<T>(key, options)
   const actions = useQueryActions<T>(key, options)
   const status = useQueryStatus(key, options)
 
-  return useMemo(
-    function (): Resource<T> {
-      return { ...basic, ...actions, ...status }
-    },
-    [basic, actions, status]
-  )
+  return { ...basic, ...actions, ...status }
 }

src/react/hooks/useQueryActions.ts

@@ -1,11 +1,10 @@
 import { type MutateOptions, type MutationValue, type Options } from 'query:index'
-import { useCallback, useDebugValue, useMemo } from 'react'
 import { useQueryInstance, type QueryInstance } from './useQueryInstance'
 
 export interface QueryActions<T = unknown> {
   readonly refetch: (refetchOptions?: Options<T>) => Promise<T>
   readonly mutate: (value: MutationValue<T>, options?: MutateOptions<T>) => Promise<T>
-  readonly forget: () => void
+  readonly forget: () => Promise<void>
 }
 
 export type QueryActionsOptions<T = unknown> = Options<T> & QueryInstance
@@ -14,8 +13,6 @@ export function useQueryActions<T = unknown>(
   key: string,
   options?: QueryActionsOptions<T>
 ): QueryActions<T> {
-  useDebugValue('useQueryActions')
-
   const {
     expiration: oExpiration,
     fetcher: oFetcher,
@@ -26,38 +23,24 @@ export function useQueryActions<T = unknown>(
 
   const { query, mutate, forget } = useQueryInstance(options)
 
-  const refetch = useCallback(
-    function (refetchOptions?: Options<T>) {
-      return query<T>(key, {
-        stale: oStale ?? false,
-        expiration: oExpiration,
-        fetcher: oFetcher,
-        removeOnError: oRemoveOnError,
-        fresh: oFresh,
-        ...refetchOptions,
-      })
-    },
-    [query, key, oExpiration, oFetcher, oStale, oRemoveOnError, oFresh]
-  )
-
-  const localMutate = useCallback(
-    function <T = unknown>(value: MutationValue<T>, options?: MutateOptions<T>) {
-      return mutate(key, value, options)
-    },
-    [mutate, key]
-  )
-
-  const localForget = useCallback(
-    async function () {
-      await forget(key)
-    },
-    [forget, key]
-  )
-
-  return useMemo(
-    function () {
-      return { refetch, mutate: localMutate, forget: localForget }
-    },
-    [refetch, localMutate, localForget]
-  )
+  function refetch(refetchOptions?: Options<T>) {
+    return query<T>(key, {
+      stale: oStale ?? false,
+      expiration: oExpiration,
+      fetcher: oFetcher,
+      removeOnError: oRemoveOnError,
+      fresh: oFresh,
+      ...refetchOptions,
+    })
+  }
+
+  function localMutate<T = unknown>(value: MutationValue<T>, options?: MutateOptions<T>) {
+    return mutate(key, value, options)
+  }
+
+  async function localForget() {
+    await forget(key)
+  }
+
+  return { refetch, mutate: localMutate, forget: localForget }
 }

src/react/hooks/useQueryBasic.ts

@@ -1,4 +1,4 @@
-import { useEffect, use, useState, useMemo, useDebugValue, useTransition } from 'react'
+import { useEffect, use, useState, useTransition } from 'react'
 import { type ContextValue } from 'query/react:context'
 import { type Options } from 'query:index'
 import { useQueryContext } from './useQueryContext'
@@ -16,8 +16,6 @@ export function useQueryBasic<T = unknown>(
   key: string,
   options?: BasicResourceOptions<T>
 ): BasicResource<T> {
-  useDebugValue('useQueryBasic')
-
   const { clearOnForget: cClearOnForget, ignoreTransitionContext: cIgnoreTransitionContext } =
     useQueryContext()
 
@@ -36,55 +34,22 @@ export function useQueryBasic<T = unknown>(
 
   const [isLocalPending, startLocalTransition] = useTransition()
   const { query, expiration, subscribe } = useQueryInstance(options)
+  const ignoreTransitionContext = oIgnoreTransitionContext ?? cIgnoreTransitionContext ?? false
+  const isPending = ignoreTransitionContext ? isLocalPending : (isContextPending ?? isLocalPending)
 
-  const ignoreTransitionContext = useMemo(
-    function () {
-      return oIgnoreTransitionContext ?? cIgnoreTransitionContext ?? false
-    },
-    [oIgnoreTransitionContext, cIgnoreTransitionContext]
-  )
-
-  const isPending = useMemo(
-    function () {
-      if (ignoreTransitionContext) {
-        return isLocalPending
-      }
+  const startTransition = ignoreTransitionContext
+    ? startLocalTransition
+    : (startContextTransition ?? startLocalTransition)
 
-      return isContextPending ?? isLocalPending
-    },
-    [isContextPending, isLocalPending, ignoreTransitionContext]
-  )
-
-  const startTransition = useMemo(
-    function () {
-      if (ignoreTransitionContext) {
-        return startLocalTransition
-      }
-
-      return startContextTransition ?? startLocalTransition
-    },
-    [startContextTransition, startLocalTransition, ignoreTransitionContext]
-  )
+  const clearOnForget = oClearOnForget ?? cClearOnForget ?? false
 
-  const clearOnForget = useMemo(
-    function () {
-      return oClearOnForget ?? cClearOnForget ?? false
-    },
-    [oClearOnForget, cClearOnForget]
-  )
-
-  const promise = useMemo(
-    function () {
-      return query<T>(key, {
-        expiration: oExpiration,
-        fetcher: oFetcher,
-        stale: oStale,
-        removeOnError: oRemoveOnError,
-        fresh: oFresh,
-      })
-    },
-    [query, key, oExpiration, oFetcher, oStale, oRemoveOnError, oFresh]
-  )
+  const promise = query<T>(key, {
+    expiration: oExpiration,
+    fetcher: oFetcher,
+    stale: oStale,
+    removeOnError: oRemoveOnError,
+    fresh: oFresh,
+  })
 
   const [data, setData] = useState<T>(use(promise))
 
@@ -177,10 +142,5 @@ export function useQueryBasic<T = unknown>(
     ]
   )
 
-  return useMemo(
-    function (): BasicResource<T> {
-      return { data, isPending }
-    },
-    [data, isPending]
-  )
+  return { data, isPending }
 }

src/react/hooks/useQueryContext.ts

@@ -1,8 +1,6 @@
 import { Context, type ContextValue } from 'query/react:context'
-import { use, useDebugValue } from 'react'
+import { use } from 'react'
 
 export function useQueryContext(): ContextValue {
-  useDebugValue('useQueryContext')
-
   return use(Context)
 }