TanStack Query without hooks

[mhuggins]

I was just looking in more depth at some of the modern React API functionality, and the behavior of the newer use function in conjunction with the Suspense component has me thinking that it would be possible to eliminate the hook aspect of TanStack Query, assuming you don't need onError and onSuccess callbacks.

You could still define your QueryClient instance and store it in the QueryClientProvider, but instead of needing useContext to get the client, the use function could be used -- and even better, it can be called from anywhere within a component.  Similarly, data fetches can just happen directly against API services, and as long as those fetches return a Promise, you can simply not await the promise like you normally might within queryFn, instead accessing it via use, which would be nested under a Suspense block.

This might already be possible with ensureQuery or something similar.

[TkDodo]

as long as use only accepts a promise and not an observable, you have the problem that your component will not be subscribed to updates coming into the query cache. so after re-fetches, your component won’t re-render. Query is a state manager and use(promise) is not.