Combination with "fetchData" idea from Apollo GraphQL

[swernerx]

I was wondering how to combine this lazy loading with "fetchData()" static methods used by Apollo for prefetching data server-side during SSR. This is implemented in getDataFromTree (see: http://dev.apollodata.com/react/server-side-rendering.html#getDataFromTree)

I see you have a custom solution for loading data which might not work for us, as we need Apollo support. Currently it seems like Apollo's logic is not waiting for the chunks which actually needs the relevant data.

Maybe you can share a hint in the docs.

[ctrlplusb]

Hey @swernerx

I can look at building an Apollo integration layer. It won't work out of the box at the moment no. :(

I plan on doing an integration between this and react-jobs so the same integration API could be reused for your case too hopefully.

I'll keep you posted if and when I make progress.

[swernerx]

Thanks! Alternatively it would help to have some simple babel plugin which removes import() from server side code and replaces it with require().default or so...

We don't need code splitting on server, right?

[swernerx]

Interestingly webpack.optimize.LimitChunkCountPlugin does not seem to affect import()s. Otherwise that would be a nice thing for server side bundling.

[swernerx]

Okay my previous statement was wrong. It works. Just make sure to use maxChunks != 0 which does not work. With maxChunks = 1 I effectively can disable all import-based code splitting in my app for NodeJS.

[swernerx]

BTW: The current (new) approach of Apollo's logic to fetch data on the server has been changed. They now call handle each component in the tree so that fetchData is required on the instance - not on the class. - This actually fixes all the previous issues with HOCs where the fetches were executed multiple times.

[navgarcha]

@swernerx were you able to get withAsyncComponents and apollo's renderToStringWithData to play nice with each other in the end? If so could you advise on the solution?

[swernerx]

@navgarcha You might want to have a look at edgestack - my current Apollo ready development stack. It includes a different async component solution which also supports locales and it works well with Apollo, yes. Needs more fine tuning and stabilization though I figure.

[navgarcha]

@swernerx perhaps i've misunderstood what you were trying todo - i can't see any use of { graphql } from 'react-apollo' or { createAsyncComponent } from 'react-async-component'?

[ctrlplusb]

FYI I am in the middle of a rewrite that will be able to provide a compat layer with react Apollo. Only requiring a single tree walk to resolve the AsyncComponents and Apollo data.🤘

[navgarcha]

@ctrlplusb awesome - is this in the next branch?

[ctrlplusb]

It will be soon 😀