NextJS: Prefetching/Hydration overwriting fresher cache data when using streaming SSR with staleTime

[toitzi]

Hey folks,

I’ve run into something odd and couldn’t find an existing discussion about it (maybe it’s a bug, maybe I’m missing something 🤔).

Setup:

• Next.js 15+
• TanStack Query 5+
• Prefetching + streaming hydration as described here
• staleTime on the server side = 5 seconds (but issue happens with longer/shorter times too)

Scenario:

1. On the server, I prefetch /users with a staleTime of 5s.
2. On the client, I load the same query via useQuery and render a table of users.

Now, within that staleTime window the following needs to happen to experience my issue:

3. A user deletes a row → I send the request, optimistically update the UI with useMutation.

   • TanStack Query Devtools show the cache updated correctly, with “Last updated” set to now.

4. The user refreshes the page → since we’re still inside staleTime, the server doesn’t refetch, but hydrates old data from the initial prefetch, overwriting the newer client cache.

   • Devtools now show the “Last updated” time as the timestamp from the original page load.
   • Result: the deleted row reappears, even though it’s actually gone on the server.

What I’d expect:
When hydrating, the server-side data should be skipped if the client already has newer/fresher data in the cache.

Question:
Is this expected behavior? Am I missing a setting here? Or could this be a Next.js SSR quirk?

---

EDIT1:
Digging a bit deeper i can see the issue comes from somewhere arround here few lines above let query = queryCache.get(queryHash) will return undefined, i think that makes sense, because client and ssr use different query clients and therefore the cache from the client is not there?

EDIT2
May also be related to/solved by this: