welldone-software / why-did-you-render

why-did-you-render by Welldone Software monkey patches React to notify you about potentially avoidable re-renders. (Works with React Native as well.)
https://www.npmjs.com/package/@welldone-software/why-did-you-render
MIT License
11.11k stars 196 forks source link

why-did-you-render + React Query #279

Open scientist1642 opened 1 year ago

scientist1642 commented 1 year ago

I wonder if someone has made it to work with react query, or if the library only works with certain type of hooks.

I have the following configuration, but updates to data doesn't cause it to log. const { data, error } = useQuery... whenever data updates component will re-render, but I don't see anything in console. (useState updates are visible though)

export function enableWhyDidYouRender(react) {
  const ReactQuery = require("@tanstack/react-query");
  if (process.env.NODE_ENV !== "development") return;
  whyDidYouRender(react, {
    include: [/./],
    exclude: [],
    trackAllPureComponents: true,
    trackHooks: true,
    logOwnerReasons: true,
    logOnDifferentValues: true,
    collapseGroups: true,
    trackExtraHooks: [[ReactQuery, "useQuery"]],
  });
}