Query running on both client and server.
AndrewIngram opened this issue · 10 comments
I'm a little confused with what's going on here, but my GraphQL query is being run twice - once on server and once on the client; even though I'm following the example. The prepared data is being correctly serialized out to the rendered page and then deserialized for use with injectPreparedData, but the client still makes the query. My understanding is that because all the query data should be in the cache, the client doesn't need to run a query of its own.
It works in my projects, so I can't tell what is wrong in your case not seeing your code, or at least instructions of how to reproduce that.
My client-side code path looks identical to yours, but for some reason injectPreparedData doesn't actually add any records to the store data. I'm trying to find if there's any fundamental structural differences between our serialized payloads, but they look very similar.
Basically, in your example, I've dropped into debugger immediately after injectPreparedData and run environment.getStoreData() , and the _records field is fully populated. In my code, doing the same gives me an empty records object. The only difference I can see is that we have different queries and data, but structurally the deserialized objects looks the same.
This is really bizarre :/
It is strange indeed. Do you produce data on the server using isomorphic-relay or by some custom method? Do you use the same version of Relay on the server and in the browser?
I think I found the issue, but not the ultimate cause.
I'm using the same versions of Relay on client and server (0.9.2), but on the client i'm using a CDN build (https://cdnjs.cloudflare.com/ajax/libs/react-relay/0.9.2/relay.js) and webpack to set it as an external, and on the server i'm using the npm module.
When I switch to use the npm module on the server, it seems to work as expected. I need to figure out the ultimate cause, since I want to continue using an external build, but it seems like Facebook's build process has an impact on its ability handle this...
I've forked and modified your example to reproduce the issue for you: https://github.com/AndrewIngram/isomorphic-relay/tree/demo-broken-cache-prime
But how did you build isomorphic-relay? It imports some internal Relay modules. You probably have two copies of Relay in the browser (one from CDN and one built into your app bundle).
I've forked and modified your example to reproduce the issue for you
Yes, you definitely have two copies of react-relay.
Hm, well that's no fun at all. I guess the only plausible solution is to somehow externalise all of isomorphic-relay's explicit imports, or just stick with the npm module instead.
I believe the CDN version of Relay does not export internal modules, so we have to stick with the NPM version for now.
@AndrewIngram is it possible that this is happening because relay automatically adds a timestamp to connections?
_projectsjoTE5:projects(after:"2016-09-07T01:59:21+02:00",first:99) {
....
}