I am going through an existing codebase, looking at some data fetching hooks that use useQuery
I am noticing that, almost everywhere, care is taken so that the arguments passed in the useQuery
hook (and other similar react-query
hooks) are referentially the same between hook executions.
For example
//custom_data_fetching_hook.js
import { useQuery } from 'react-query';
function fetchSomeStuff() {
// server data request implementation
}
const queryOptions = {
// object as described in the 3rd argument here:
// https://react-query.tanstack.com/reference/useQuery
};
export function useSomeServerStuff() {
return useQuery(['query key'], fetchSomeStuff, queryOptions);
}
My question is this:
Is it necessary to ensure referential stability for the useQuery
, useMutation
, etc, arguments? As far as I could tell the docs do not say you should do this.
Would the react-query
hooks redo calculations on every component re-render if their arguments are not referentially the same between renders?
Would the react-query
hooks return some referentially different items within their return object value if their arguments are not referentially the same between renders? (for example the mutate
function inside the return object of useMutation
)