React-apollo: 1.4.16, simple configuration, render twice or more. Performance loss. DEMO linked.

Created on 26 Feb 2018  路  9Comments  路  Source: apollographql/react-apollo

Intended outcome:

I need render twice at first because of loading: true - false in data but after just one render of maybe two if data is changed.

Actual outcome:

With simple default configuration react-apollo renders twice or more. But maybe the problem is me.
Here is the sandbox: https://codesandbox.io/s/6j6pwlqoqn

How to reproduce the issue:

Here is the sandbox: https://codesandbox.io/s/6j6pwlqoqn

Version

Most helpful comment

I'm running into this issue.

Components are rendering twice on the server, the first time the component is rendering fine, all data is there, and loading is false

The second time the data is gone and loading is true.

So, this is causing all my SSR components to just render out their loading states to the browser, not the proper component.

All 9 comments

Have you tried newer versions of the libraries?

apollo-client is at 2.2.5 (https://github.com/apollographql/apollo-client/releases)
and react-apollo is at 2.0.5 (or 2.1.0-beta.3) (https://github.com/apollographql/react-apollo/releases)

@n1ru4l thanks for you answer. No, I have not. Because I need offline support and for now Apollo 2 lacks. Am I wrong?

But in any case, is this bug possible? Or am I wrong also here?

Have you seen the codesandbox example?

@n1ru4l, the same with Apollo 2. I switched yesterday to it.

Maybe the problem it's me. But this reproduction is just a simply one: https://codesandbox.io/s/72kllvom21

Can you see what's the problem?

Just switch the menu links and see the log.

image

I have the same problem.

Just adding a simple query like you did (export default graphql(PLAYERS_QUERY)(Players);) make my component render twice even if the first time the data was already loaded.

[email protected]
[email protected]

I'm running into this issue.

Components are rendering twice on the server, the first time the component is rendering fine, all data is there, and loading is false

The second time the data is gone and loading is true.

So, this is causing all my SSR components to just render out their loading states to the browser, not the proper component.

Something new about it ?

@wesbos I have the same issue with SSR.

The first render is usually the call to getDataFromTree, and the second one from the "normal" render (at least in my case where I'm using next.js). So rendering twice is expected.

However, when I log the cache's content it's there in the second render but data is{} (not null!) and loading is true 馃

OK, nevermind, I made a mistake: I didn't actually use the apollo client instance in the render in getDataFromTree which I used to extract the cache 馃槕 .

Closing - housekeeping.

Was this page helpful?
0 / 5 - 0 ratings