useQuery causes multiple renders

[novaknole]

This might be a very well known issue, but I couldn't find the answer for urql package.

It seems like useQuery causes my component to re-render multiple times. In my case 2 times, sometimes 3 times.

Why does this happen ? any workaround ?

[kitten]

It's not quite a re-render and this is expected behaviour and required, especially to comply with the rules of concurrent mode for concurrent mode safety, suspense, and the rules of hooks in general. What's actually happening is that the initial mount has consistent state with the subsequent renders, but the effect will have to actually start the side-effects of executing queries, so they will at least call setState once to update the result, even if it's identical to the last, since it may have changed from the time of render.

The useQuery code in urql is pretty optimised, but has also been rewritten to comply to as many guidances and rules of the React team as possible to ensure that it'll continue working as expected in future experimental React versions and with new rendering features enabled. So it's something you don't really have to worry about, and rather, it makes sense, as before, to just let React re-render when it wants and to react to those renders appropriately.

[novaknole]

That makes sense, but one really big problem is the following.

I have these settings

  requestPolicy: 'cache-and-network',
    pollInterval: 13 * 1000,

And it seems like one of my function even gets called 10 times every 13 seconds.. Could this still be urql or it's my own issue ?

[kitten]

pollInterval was removed in v2.0.0 since it didn't add any value above a new effect: https://github.com/FormidableLabs/urql/blob/main/packages/react-urql/CHANGELOG.md#major-changes
You'll also notice that starting from v2.0.0 the hook implementation of useQuery has changed to achieve the goals I've mentioned above, so as you may be able to tell from that, in v2 you may see subtly different rendering/update behaviour that complies with concurrent mode.

one of my function even gets called 10 times every 13 seconds

No, that doesn't sound like an urql issue. That sounds more like a timer somewhere else is causing an issue.