bgaleotti / react-query-native-devtools

161 stars 19 forks source link

feat(plugin): migrate to sandy, improve performance #76

Closed DenisIrkhin closed 2 years ago

DenisIrkhin commented 2 years ago

First and foremost: Thank You for the plugin! We started using it back in March 2021 and it is a super nice tool and the only possible Flipper plug-in back in the time. I highly doubt that we could start our RQ journey without the plugin. Thank You, Bruno!

Motivation: We started using RQ actively for React Native app. As we add more RQ based features we started to see the losing performance of the plugin. Now we have about 100 queries on average per user. In particular, when we re-select a query it takes 2-3 sec to show the right sidebar.

Rendering the whole query tree in the DOM is a heavy task. So the idea was to see it collapse by default. I tried to adjust the plug-in but it turned out that Flipper requires a new Sandy API and I have to migrate the plugin there. After it's done we have a nice UI with dark mode and collapsed by default sidebar

Another improvement: we used to send the whole QueryCache on each query/observer change which is heavy for Flipper. Now we are sending only

Description

DenisIrkhin commented 2 years ago

I've tested for our QueryCache flow - it works decently. With intense Cache updates(as I tested) we have table scrolling to the bottom constantly. I added enableAutoScroll and it looks better but probably it could be done in a better way.

Unfortunately, I don't see CI status.

It's ready for review @bgaleotti Thanks in advance.

bgaleotti commented 2 years ago

Released on v4.0.0 🚀.

Thanks for your contribution @DenisIrkhin 🙌!