Use `fetch` response data if schema is not passed

[damassi]

This PR allows uses fetch response data if schema isn't provided, since oftentimes its not possible to access the schema when querying a remote GraphQL server.

Additionally, adds a lookup option to RelayClientSSR for preserving cache once the client has mounted so that when transitioning away from then back to a route that has been SSR rendered a new request isn't sent out. (This option could be removed if there was some way to internally share the cache from cacheMiddleware if present, but this seems to suffice for now.)

Fixes https://github.com/nodkz/react-relay-network-modern-ssr/issues/2

[nodkz]

Wow! I could not even imagine such simple and thats why brilliant solution.👌 Thanks a lot. 👍

But i wll merge it only on Monday. Need to setup CI, for automatic package building and publishing. Cannot do it from mobile right now.

[nodkz]

Ouch! Forgot to ask you add some info to readme.md about your improvement. Please add something 😉

[damassi]

Updated! Once my current sprint is finished I'll try to open another PR with a full working example and flesh out the docs a bit more.

[damassi]

@nodkz - I've started a little example app here, but am running into an issue and was wondering if you might be able to see if I'm doing something silly.

Basically, I'm 100% certain that everything is caching and retrieving as it should. Setting debug on the middleware instance to true returns everything correctly, and data is being properly rehydrated on the client. However, if I comment out clientside rendering here and then log out the server-rendered html here it will only ever render the QueryRender's loading state as seen here. It says its returning the cache but for whatever reason, and only server-side, QueryRenderer never calls render with props. (Here is where I'm setting up the network layer.) I'm certain I'm missing something obvious somewhere.

[nodkz]

Take a look at https://gist.github.com/nodkz/ee25063925ea51a753c4ace7c165c1ef

You need to use custom QueryRenderer which use caching on server side.

Moreover when you solve this problem, the next will be sync client hydration for avoiding redundant loaders blinks on client side. Again for Relay 1.4.1 you will need a custom query renderer.

Both these problems are solved by gist above

[nodkz]

Relay 1.5 have retain or lookup property for QueryRendere. But it has problem with recursive input arguments for relay-compiler. We skip this version.

Relay 1.6 was not tested by me. Will do it in June.

Right now we are also using 1.4.1 version.

[damassi]

I see, so this bit here. I had assumed that by returning a cache at the network level one could skip messing with internals and trick relay into thinking it was dealing with a normal request -- at which point it would fill in the blanks, and populate props with data.

We've got a 1.5 fork that we use at Artsy; I'll give that a try.

[damassi]

Using our 1.5 fork and setting dataFrom="STORE_THEN_NETWORK" here gets me almost there -- after the request has been cached it will subsequently serve it up and skip the preloader, sending the proper markup down to the client. The only problem is that on the first request, server-side, it doesn't seem to cache, even if I run renderToString multiple times. I think i might just need to play with it. But def closer!

[nodkz]

Take a look at my PR in your repo https://github.com/damassi/react-relay-network-modern-ssr-example/pull/1 It fixes the main problem: a creation of relay environment for every request.

[nodkz]

I just set up automatic package publishing via Travis. So now I may publish new packages even from mobile at any time.

When you get working demo, please add a link to this repo. And after my PR to your demo maybe need to add some clarification to the readme.

So waiting for a working demo and after that, I'll merge this PR.

[nodkz]

By the way, you may join to Slack Channel https://graphql.slack.com/messages/C0BEXJLKG SSR is an active discussion right now

[damassi]

@nodkz - README has been updated with a link to the example app which should work once this is merged.

Here's some backstory in slack, but after talking with @taion realized we were facing an issue with asynchronous resolution inside of Relay 1.5. Putting the second server-side render behind next tick fixes it (combined with STORE_THEN_NETWORK).

[damassi]

Added TodoMVC universal example using found-relay: https://github.com/damassi/react-relay-network-modern-ssr-todomvc.

I've updated the main description with some details on the lookup option below.

[nodkz]

:tada: This PR is included in version 1.1.0 :tada:

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot :package::rocket:

[nodkz]

Hey, @damassi this is incredible work! 👍 Thanks a lot!!! Especially for examples and docs.

[damassi]

@nodkz - really glad this worked out, I def think this is the way to go with SSR relay now -- very simple to get started :)

At some point I'd like to contribute back to to the docs in react-relay-network-modern, maybe create a little docs site.

[nodkz]

Chriss, I'll migrate my repos to relay-tools org. So make changes in your repo settings.

Alloy ask me and Taion to move our Relay's repos under one GitHub organization https://github.com/relay-tools It will be better for users to find all recommended plugins and tools in one place.