import { useQuery } from '@tanstack/react-query';
function App() {
const { data } = useQuery({ queryKey: ['todos'], queryFn: fetchTodos });
return <div>{data?.map(todo => <div key={todo.id}>{todo.title}</div>)}</div>;
}
Protocol-agnostic fetching — Works with REST, GraphQL, promises, and custom fetching strategies.
Automatic caching and refetching — Manages cache lifecycle with stale-while-revalidate and background synchronization.
Pagination and infinite scroll — Built-in patterns for loading data in chunks and incremental updates.
Mutations and side effects — Handles server updates with dependent query invalidation and background syncing.
Multi-framework support — Drop-in adapters for React, Vue, Solid, and Svelte ecosystems.
TanStack Query eliminates boilerplate for server state management across React, Vue, Solid, and Svelte. It handles caching, synchronization, and refetching automatically, letting you focus on UI instead of async state plumbing. The library's battle-tested patterns for pagination, mutations, and background updates make it the standard for data fetching in modern web apps.
Node.js; framework-specific peer dependencies (React, Vue, Solid, or Svelte)