TanStack Query vs why-did-you-render
Which should you use? A side-by-side look at what each one does, who it suits, what it costs, how hard it is to set up, and where each falls short.
Open source · MIT
A library for fetching, caching, and updating data from servers in web apps.
Open source · MIT
A development-only tool that logs React re-renders that may be avoidable, so you can find slow spots.
The short answer
Choose TanStack Query if you need…
- Frontend developers building apps that load data from a server
- Teams using React, Solid, Svelte, or Vue who want less hand-written loading and caching code
- Apps that need pagination, infinite scroll, or background refresh of data
Choose why-did-you-render if you need…
- React developers investigating slow screens with many memoized or pure components
- Teams debugging why a large memo component keeps re-rendering after a prop like an inline style object changes
- Developers who want to track custom hooks such as useSelector from React Redux
- React Native developers using Metro or Expo with a Babel setup
Side-by-side
| TanStack Query | why-did-you-render | |
|---|---|---|
| Type | Library | Library |
| Price | Free and open source | Free and open source |
| Licence | MIT | MIT |
| GitHub stars | 50.5k | 12.5k |
| Setup difficulty | Intermediate | Intermediate |
| How you get it | Install with a package manager | Install with a package manager |
| Main language | TypeScript | JavaScript |
| Last code update | 4 days ago | 7 months ago |
What each one is
TanStack Query
TanStack Query is an open-source library for managing server data in web apps. It handles fetching data from an API, caching the results, keeping them in sync, and updating them after changes. The README says it works with REST, GraphQL, or any promise-based fetching, and it has versions for React, Solid, Svelte, and Vue.
why-did-you-render
Why Did You Render is a library that hooks into React and prints notices when a component re-renders even though its props or state did not meaningfully change. It is aimed at developers hunting for performance problems in React and React Native apps. The README says it should only be used in development, since it noticeably slows React down.
Best for
TanStack Query
- Frontend developers building apps that load data from a server
- Teams using React, Solid, Svelte, or Vue who want less hand-written loading and caching code
- Apps that need pagination, infinite scroll, or background refresh of data
why-did-you-render
- React developers investigating slow screens with many memoized or pure components
- Teams debugging why a large memo component keeps re-rendering after a prop like an inline style object changes
- Developers who want to track custom hooks such as useSelector from React Redux
- React Native developers using Metro or Expo with a Babel setup
Strengths
TanStack Query
- Covers fetching, caching, refetching, and mutations in one library
- Works with multiple frameworks and any promise-based or GraphQL data source
- Large community: about 50,000 GitHub stars and an MIT license
why-did-you-render
- Targets a specific problem: showing when a re-render may be avoidable, with reasons
- Works with React Native as well as React web apps, according to the README
- Simple opt-in: enable tracking for all pure components or mark individual components
Not ideal for
TanStack Query
- People who only need a simple static site with no server data (the library adds complexity without benefit)
- Non-developers looking for a ready-made app (this is a code library, not an end-user tool)
why-did-you-render
- Production builds, because the README warns it significantly slows React and monkey patches it, which can cause unexpected behavior
- Projects using React Compiler, which the README says was not tested with the library and is believed to be incompatible
- Projects on React 18 or older without using the matching older version branch (v8 for React 18, v7 for React 16/17)
- Users who want Mobx support, which the README says is currently not supported
Trade-offs
TanStack Query
- Requires learning its concepts (queries, mutations, cache keys) before it is productive
- The README is truncated here, so detailed setup and API behavior are not covered in this entry
why-did-you-render
- Only tested with React 19 in the current version; older React versions need older releases
- Must be kept out of production builds and monkey patches React, so setup needs care
- The README notes that not every re-render is a problem, and chasing them can add complexity without benefit
Getting started
TanStack Query
Clone the repository
git clone https://github.com/TanStack/querywhy-did-you-render
Install as a dev dependency with npm
npm install @welldone-software/why-did-you-render --save-devInstall as a dev dependency with yarn
yarn add @welldone-software/why-did-you-render -DFrequently asked questions
What is the difference between TanStack Query and why-did-you-render?
TanStack Query: A library for fetching, caching, and updating data from servers in web apps. why-did-you-render: A development-only tool that logs React re-renders that may be avoidable, so you can find slow spots. TanStack Query suits frontend developers building apps that load data from a server, while why-did-you-render suits react developers investigating slow screens with many memoized or pure components.
Are TanStack Query and why-did-you-render free?
TanStack Query: Free and open source. why-did-you-render: Free and open source.
Is TanStack Query or why-did-you-render more popular?
TanStack Query has more GitHub stars (50.5k) than why-did-you-render (12.5k). Popularity isn't the same as fit — check which one matches your use case above.
What are other alternatives to TanStack Query and why-did-you-render?
Other options people compare them with include SWR, Apollo Client, ky, react-loadable, Zustand.
Keep comparing
Built from our catalogue entries for both products: open-source details come from each project's README (AI-assisted, refreshed weekly) and GitHub data; AI-tool details are editorial. Spotted something wrong? Let us know from either product's page.