search

apollographql / apollo-client-nextjs

Apollo Client support for the Next.js App Router
https://www.npmjs.com/package/@apollo/experimental-nextjs-app-support
MIT License
448 stars 35 forks source link

How can I overcome race conditions #342

Closed Tsimopak closed 2 months ago

Tsimopak commented 2 months ago

Hi,

I was very scared from this message:

❗️ This package is experimental. Generally it should work well, you might run into race conditions when your Client Component is still rendering in SSR, and already making overlapping queries on the browser. This cannot be addressed from our side, but would need API changes in Next.js or React itself. If you do not use suspense in your application, this will not be a problem to you.

And I also found out in this issues page the following explanation: https://github.com/apollographql/apollo-client-nextjs/issues/28

At the end the mentioned issue, @phryneas suggests that maybe a timestamp mechanism could be used. (https://github.com/apollographql/apollo-client-nextjs/issues/28#issuecomment-1567992469)

Is it still something that is planned to be done? It just feel very odd to me that a nextjs with apollo graphql wouldn't work, because they both a very very popular packages. and the described race is actually not that imaginary, it's certainly can happen in many many websites I know and also in the one i'm building.

Is there anything I can do to mitigate or solve as a workaround in my project? can I add control what is processed in the cache so I would implement the timestamp logic on my app? or any other workarounds? any plans? Is this issue occur with other graphql client packages?

phryneas commented 2 months ago

This is something that can not really be tackled on our side - yes, we could rewrite the whole core of Apollo Client to add timestamps, but that's hardly a practical course of action (it would be a massive rewrite).

The correct place to solve this is the React core - and they have signaled that they will add something for it, but only after the release of React 19. So we are waiting for upstream. Keep in mind that Next.js is based on a lot of React 19 features, and that React 19 is not released yet. Even while they call the Next.js App router stable, there is just a lot of missing primitives in the canary builds of React that the App router is based on.

That said, this package is over a year old at this point, and so far we haven't had anyone actually give us reports of these race conditions causing problems in real-world applications. I would say you are fine to use this package - we know of a few very big sites using it in production without problems.

Is this issue occur with other graphql client packages?

These problems exist with any data fetching library. Either there is no support for streaming SSR at all, or they have all the same problems we have.

Tsimopak commented 2 months ago

Thanks @phryneas for the fast response <3

github-actions[bot] commented 2 months ago

Do you have any feedback for the maintainers? Please tell us by taking a one-minute survey. Your responses will help us understand Apollo Client usage and allow us to serve you better.