tanstack-query
TanStack Query handles server-state fetching and caching in React applications, automating data synchronization and eliminating manual boilerplate. It provides built-in background refetching, optimistic mutations, intelligent cache invalidation, and pagination support for complex data workflows.
TanStack Query manages server-state fetching and caching in React with automatic background refetching and optimistic updates.
AI-generated summary based on this skill's SKILL.md
Decision gist · record as of 2026-07-18
TanStack Query manages server-state fetching and caching in React with automatic background refetching and optimistic updates. TanStack Query handles server-state fetching and caching in React applications, automating data synchronization and eliminating manual boilerplate. It provides built-in background refetching, optimistic mutations, intelligent cache invalidation, and pagination support for complex data workflows.
Use it when
- TanStack Query manages server-state fetching and caching through declarative hooks like useQuery and useMutation.
- Yes, TanStack Query supports automatic background refetching and cache invalidation out of the box.
Verify before relying
Read SKILL.md below before installing (2 files). Open directory: indexed for reading, not audited.
Install
bobmatnyc/claude-mpm-skills/tanstack-query · repository language: Python
Open directory. Skills are indexed for reading, not audited. Review a skill's body before installing it.
Frequently asked questions
AI-generated answers based on this skill's SKILL.md and metadata
What is tanstack-query and what does it do?
TanStack Query is a React library for managing server-state fetching and caching, automating data synchronization and eliminating manual boilerplate. It provides built-in background refetching, optimistic mutations, intelligent cache invalidation, and pagination support for complex data workflows.
How does tanstack-query handle server state management in React?
TanStack Query manages server-state fetching and caching through declarative hooks like useQuery and useMutation. It automatically handles background refetching, cache invalidation, and data synchronization, reducing the need for manual state management and API call coordination in React applications.
Can tanstack-query implement automatic background refetching and cache invalidation?
Yes, TanStack Query supports automatic background refetching and cache invalidation out of the box. It intelligently refetches data when windows regain focus, intervals elapse, or queries are manually invalidated, keeping your cached data fresh without manual intervention.
How do you build pagination and infinite scroll with tanstack-query?
TanStack Query provides useInfiniteQuery for cursor-based pagination and infinite scroll patterns. It manages page state, handles fetching subsequent pages, and merges results seamlessly, enabling efficient infinite scroll implementations without complex manual coordination.
Does tanstack-query support optimistic UI updates and mutations with rollback?
Yes, TanStack Query's useMutation hook supports optimistic updates that immediately reflect changes in the UI before server confirmation. If the mutation fails, TanStack Query automatically rolls back the optimistic update, maintaining data consistency and providing a smooth user experience.
Can tanstack-query integrate with Next.js SSR and server-prefetched data?
TanStack Query integrates with Next.js SSR by hydrating server-prefetched data into the client cache. This eliminates duplicate requests and enables seamless data synchronization between server-rendered pages and client-side queries, improving performance and user experience.
SKILL.md
Rendered from the published skill. Quoted content, verbatim.
TanStack Query (React Query) Skill
Summary
TanStack Query (formerly React Query) is a powerful asynchronous state management library for React that handles server-state fetching, caching, synchronization, and updates. It eliminates the need for manual data fetching boilerplate and provides built-in features like background refetching, optimistic updates, pagination, and intelligent cache management.
When to Use
Use TanStack Query when: - Fetching data from REST APIs, GraphQL, or tRPC endpoints - Need automatic background refetching and cache invalidation - Building real-time dashboards with polling or
(truncated - see the full file via the links below)
File tree — 2 files
toolchains/typescript/state/tanstack-query/SKILL.md
toolchains/typescript/state/tanstack-query/metadata.json
Let your AI agent find skills like this
Example. Real query, live index.
You found this page by searching. An agent finds it by wishing: SkillFed indexes 56,283 agent skills by what they can do, searchable in plain language.
wish › “Manage server-state fetching and caching in React applications”
Give your agent the search over MCP, or paste the wish link into any chat. No install? Search from any chat →
Related skills
Master server state management and data fetching with TanStack Query through expert guidelines covering query organization, mutations, caching strategies, and performance optimization. This skill teaches you how to structure queries with factory patterns, implement optimistic updates, handle errors gracefully, and prefetch data efficiently.
TanStack Query provides asynchronous state management for server data across React, Vue, Solid, Svelte, and Angular. It handles caching, background synchronization, pagination, infinite scrolling, and optimistic updates automatically. Use queries for data fetching and mutations for server modifications, with lifecycle hooks for managing side effects and rollback scenarios.
Senior Frontend enforces a three-phase workflow for shipping React and Next.js code: context discovery to map your stack, development with atomic design and TDD, and handoff verification of test coverage and performance. It mandates TypeScript strict mode, comprehensive testing across unit, integration, and E2E layers, and decision tables for state management, SSR patterns, and component architecture.
Master server-side data fetching and caching with React Query v5, plus client state patterns using Zustand v5. This skill covers query setup, cache invalidation, mutations, optimistic updates, and combining both libraries for complete state control.
TanStack Query v5 handles server state management in React through data fetching, caching, and mutation patterns. Learn QueryClient setup, hook usage with the v5 object syntax, and common migration issues from v4.
This skill covers expert patterns for TanStack Query in modern React with Next.js App Router, including QueryClient configuration, query key factories, cache invalidation, and optimistic updates. Learn critical anti-patterns to avoid—like singleton QueryClients on servers, unstable query keys, and N observers per list item—plus decision matrices for cache configuration and mutation strategies.
More skills react-query-best-practices (MIT) · testing-strategy (MIT) · bug-fix-tdd (Apache-2.0) · tanstack-query (MIT) · App Renderer Systems (unlicensed) · Tanstack Integration (unlicensed) · tanstack-devtools (MIT) · Tanstack Table (unlicensed)