T
TanStack•14mo ago
ratty-blush

useQueries({ combine: ... }) vs useMemo

Is there any advantage to using combine in useQueries vs taking all the query results and passing into useMemo to "reduce" results down? Seems like since we lose the nuance of each query in combine, we'd get the ~same effect with a useMemo
6 Replies
ratty-blush
ratty-blushOP•14mo ago
const result = useQueries({
  queries: [query1, query2],
  combine: (results) => ({
    data: results.map((result) => result.data),
    pending: results.some((result) => result.isPending),
  }),
});
const result = useQueries({
  queries: [query1, query2],
  combine: (results) => ({
    data: results.map((result) => result.data),
    pending: results.some((result) => result.isPending),
  }),
});
vs 
const results = useQueries({
  queries: [query1, query2],
});
const result = useMemo(() => ({
  data: results.map((result) => result.data),
  pending: results.some((result) => result.isPending),
}, [results]);
const results = useQueries({
  queries: [query1, query2],
});
const result = useMemo(() => ({
  data: results.map((result) => result.data),
  pending: results.some((result) => result.isPending),
}, [results]);
adverse-sapphire
adverse-sapphire•14mo ago
results is a new reference in each render so the second one doesn't work
ratty-blush
ratty-blushOP•14mo ago
okay, what about 
const results = useQueries({
  queries: [query1, query2],
});
const result = useMemo(() => ({
  data: [result1.data, result2.data],
  pending: result1.isPending || result2.isPending,
}, [result1, result2]);
const results = useQueries({
  queries: [query1, query2],
});
const result = useMemo(() => ({
  data: [result1.data, result2.data],
  pending: result1.isPending || result2.isPending,
}, [result1, result2]);
adverse-sapphire
adverse-sapphire•14mo ago
What's result1 and result2? Anyway we made combine to give you an easier way to do this. What problems do you have with combine?
ratty-blush
ratty-blushOP•14mo ago
just wanted to confirm my understanding doesn't feel like it reduces complexity or provide enough value to justify it over useMemo, which is clearer to me + more powerful I am assuming useQuery returns a stable reference?
adverse-sapphire
adverse-sapphire•14mo ago
No, the top level one is always a new object

Did you find this page helpful?