ReactQueryDevtools renders on the page in the closed state

[KatsiarynaMashokha]

Hi all, I have the following question. I noticed some changes to ReactQueryDevtools: when it was a separate package react-query-devtools with react-query v2, in the closed state it did not render on the page. After migrating to react-query v3 I can see that ReactQueryDevtools are rendered on the page in closed state (I can see that class ReactQueryDevtoolsPanel has an opacity of 0 for closed state). Is it intended for them to be always present even in the closed state?

The reason why I'm bringing this up is that react query dev tools are being constantly rendered in the closed state that makes the UI irresponsive for a few seconds. A thing to note is that we use huge query keys for useQuery (which we probably need to change as well, not sure how to yet though), and those keys seem to cause rerendering of react query dev tools after every button click in the UI and block it for a few seconds. However, we didn't encounter this kind of behavior with react-query-devtools and react-query v2.

[TkDodo]

interesting. are you able to pinpoint the code change that is different between the two versions? We can try going back to the v2 behaviour, I'm not sure why that was changed though

[KatsiarynaMashokha]

I believe it is due to the following: in react-query-devtools, ReactQueryDevtoolsPanel is rendered if isResolvedOpen is set to true: https://github.com/tannerlinsley/react-query-devtools/blob/d8cd2cb107a7cfaabb42b0fbc9fb144b343ec51c/src/index.js#L99-L101 , but in react-query v3 the panel is always there, the prior prop just controls the opacity of the devtools panel: https://github.com/tannerlinsley/react-query/blob/cfecf5261e60684d60c3bd788a7a517cc938a065/src/devtools/devtools.tsx#L207-L218

[robherley]

Sorry to thread hijack, but I think this issue I submitted is probably related: #2019

[TkDodo]

generally, devtools are kept rendered because they have local state (filers, sorting), and that would get lost with unmounting. However, I made a PR that stops subscriptions to the queryCache while they are closed to solve the perf issue in closed state, please see: #2045