Relay: Collapse and Batch queries

Created on 27 Oct 2015  Â·  10Comments  Â·  Source: facebook/relay

I have a Relay.Route that defines multiple queries and Relay is making one call for graphql for each query.

  static queries = {
    firstQuery: (Component) => Relay.QL`
      query {
        fieldOne
      }
    `,
    secondQuery: (Component) => Relay.QL`
      query  {
        fieldTwo
      }
    `
  }

How can I make Relay aggregate those queries in just one request? How this aggregation works?
Thanks in advance!

enhancement

Most helpful comment

@josephsavona @KyleAMathews
I can not publish my gist as npm module. It is too dumb.

So, I spent all current day and made this great thing: https://github.com/nodkz/react-relay-network-layer
With some simple middlewares. Open for review and PRs.

All 10 comments

We just had a conversation about what role core can play here. Broadly:

  1. You could create a new batching network layer (and an associated server implementation) that batches those queries together into a single fetch, streams back the results as they're available, and calls request.resolve(…) on each RelayQueryRequest. This is what we do at Facebook.
  2. Relay core could combine each query into one so you get batching by default. Would have to auto-alias each root field (eg. user to user as user0, in case there are multiple user root calls in the batch).

We should carefully trade off against:

a. New demands we place on the implementation of GraphQL servers
b. The ability to maintain choice with respect to _how_ queries are parallelized (client-side? server-side?)
c. The ability to stream responses into the system as they become ready

Looping in @josephsavona and @wincent.

Are you interested in helping with this?

:+1:

Thanks for you response @steveluscher
Currently, I'm going with a solution similar to the first option you pointed out. I feel better for now, since I'm not the only one doing this way, but yes, would be awesome to see this in the core.

Can you provide here proper example of merging several RelayQueryRoot into one another?
Right now I wrote own network layer with JWT, last piece is reducing 7 requests into one in sendQueries method.

Relay doesn't support "merging" queries together. Instead, we recommend creating a custom network layer that takes the list of queries passed to sendQueries and sends them to the server in a single http request. This is what we do in our internal network layer implementation.

I wrote a bit more about how to do this here, but you can use the getID() method on each query request as a key to identify which data goes with which query.

@josephsavona thanks for clarification.

If somebody needs example of BatchNetworkLayer, and wrapping express-graphql you can found it here https://gist.github.com/nodkz/d9a6380d55067192295382e8e490f39f

@nodkz would be cool to publish that as an npm module :-)

+1 to that. I was going to ask the same :-) I'd help maintain it!

On Thu, Apr 21, 2016 at 12:15 PM Joseph Savona [email protected]
wrote:

@nodkz https://github.com/nodkz would be cool to publish that as an npm
module :-)

—
You are receiving this because you are subscribed to this thread.

Reply to this email directly or view it on GitHub
https://github.com/facebook/relay/issues/520#issuecomment-213023236

@josephsavona @KyleAMathews
I can not publish my gist as npm module. It is too dumb.

So, I spent all current day and made this great thing: https://github.com/nodkz/react-relay-network-layer
With some simple middlewares. Open for review and PRs.

@nodkz awesome! Thanks for publishing this! I'm going to go ahead and close this issue :-)

Was this page helpful?
0 / 5 - 0 ratings

Related issues

brad-decker picture brad-decker  Â·  3Comments

mike-marcacci picture mike-marcacci  Â·  3Comments

MartinDawson picture MartinDawson  Â·  3Comments

piotrblasiak picture piotrblasiak  Â·  3Comments

janicduplessis picture janicduplessis  Â·  3Comments