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
Install
bobmatnyc/claude-mpm-skills/tanstack-query · repository language: Python
git clone https://github.com/bobmatnyc/claude-mpm-skills
cp -r claude-mpm-skills/toolchains/typescript/state/tanstack-query ~/.claude/skills/tanstack-queryFrequently 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)
Read as markdown · JSON record · Browse the source repository
File tree — 2 files
toolchains/typescript/state/tanstack-query/SKILL.md
toolchains/typescript/state/tanstack-query/metadata.json