Provide a way for hooks to pause and resume re-rendering on cache updates

[jbachhardie]

It would be incredibly helpful to have an API that allowed us to make a hook stop re-rendering the component its in when the cached data changes. I'm imagining something like:

const { data, startListening, stopListening } = useSuspenseQuery(query)

useFocusEffect(useCallback(() => {
  startListening()
  return () => stopListening()
}, [startListening, stopListening])

This is specifically because when working with React Native you usually (in common frameworks like React Navigation) keep previous screens mounted after navigating to other screens so that navigating back to them can be animated smoothly. This can really tank performance if a bunch of previous screens were all, say, requesting a field that updates frequently, since React will be processing a large amount of renders for components that are currently hidden from view.

With useQuery it was possible to achieve this effect by using observable.silentSetOptions({ fetchPolicy: 'standby' }) but now that useSuspenseQuery shares the same observable between multiple hooks setting the fetchPolicy has wider potential effects than would be intended.