skills.rest
rezics
rezicsOFFICIAL
Explore all skills by this author →
WebsiteGitHub

tanstack-query

Manage server-state data with caching and synchronization across client applications.

6|1|Updated Jun 1, 2025
Search Tags:#typescript#caching#react-query#data-fetching#server-state#query-keys
One-click install
npx skills add https://github.com/rezics/rezics --skill tanstack-query-rezics
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tanstack-query
Source: https://github.com/rezics/rezics/tree/main/.agents/skills/tanstack/query
Command: npx skills add https://github.com/rezics/rezics --skill tanstack-query-rezics

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

TanStack Query solves the challenge of managing server-state in client applications by providing automatic caching, background updates, and synchronization across components.

Core Features & Use Cases

  • Automatic caching and background refetching to keep UI in sync with server data.
  • Support for stale-while-revalidate, pagination, infinite scrolling, and optimistic updates to improve user experience.
  • Structured data flow with query keys, invalidation, prefetching, and seamless integration with a QueryClient for consistent data handling.

Quick Start

Install the library and wrap your app with a QueryClientProvider to begin fetching and caching server data.

Frequently Asked Questions about tanstack-query

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I manage server-state and cache fetched data in TypeScript applications?▼

Server-state management is handled by caching fetched data, synchronizing client components, and performing background refetching to keep the UI updated with server changes automatically.

Can I use TanStack Query for data fetching and infinite scrolling in Vue or Solid apps?▼

TanStack Query works across React, Vue, Solid, Svelte, and Angular ecosystems, providing data fetching, automatic caching, and built-in features for infinite scrolling and pagination.

What is the best way to handle stale-while-revalidate patterns and optimistic updates?▼

Stale-while-revalidate patterns and optimistic updates are supported natively, allowing applications to display cached data immediately while refetching in the background and applying UI changes optimistically.

How do query keys and invalidation work for prefetching data with a QueryClient?▼

Query keys structure cached data hierarchically, enabling precise invalidation and background prefetching through a centralized QueryClient to ensure consistent data synchronization across components.

Why does my client application lose synchronization with server data after mutations?▼

Synchronization issues occur when cached server-state is not invalidated after mutations; leveraging query invalidation triggers automatic background refetching to restore sync with the server.

Related Skills

Explore More Software Engineering Skills→
BIGSHOLBIGSHOL

verify-query-patterns

Validate React Query cache keys, enabled options, and staleTime settings in TypeScript projects.

Community
Intermediate
mauriciodelriomauriciodelrio
3

fetching-rules

Implement end-to-end data fetching in React/Next.js with TanStack Query v5.

Community
Advanced
iEnergyyiEnergyy

tanstack-query

Manage server-state data with automatic caching and background refetching.

Community
Advanced
nekorush14nekorush14
4

react-state-management

Manage React client state with Context API and server state with TanStack Query.

Community
Advanced