tanstack/query

TanStack Query is a library for managing the state that comes from a server or remote data source in a JavaScript or TypeScript web application. In a typical web app, you constantly need to fetch data from an API, show loading states while waiting, handle errors, keep the data fresh when it changes, and avoid redundantly re-fetching data that you already have. Writing all this logic manually leads to repetitive, error-prone code scattered throughout an application. TanStack Query provides a set of tools that handle all of this automatically. The core idea is that you describe a query using a key and a function that fetches the data. The library then handles caching the result, reusing it when the same data is requested in multiple places on the page, automatically refetching it in the background when it becomes stale, and showing your component the current state including whether it is loading, has data, or has errored. It also handles mutations, which are write operations like submitting a form or deleting a record, and can automatically invalidate cached queries after a mutation so related data refreshes. Advanced features include pagination, infinite scrolling, prefetching data before navigation, and request cancellation. You would use TanStack Query when building a React, Vue, Svelte, or SolidJS application that makes API calls and you want to avoid writing your own caching and synchronization logic from scratch. It is widely used in production web applications to simplify data-fetching code. The library works with any protocol, whether REST, GraphQL, or any promise-based fetch. It is installed as an npm package, written in TypeScript, and the framework-specific versions like React Query are thin wrappers around a shared framework-agnostic core.