skills.rest
geinala
geinalaOFFICIAL
Explore all skills by this author →
WebsiteGitHub

tanstack-query

Configure TanStack Query v5 server-state management for React applications.

Updated Nov 15, 2025
Search Tags:#tanstack#migration#ssr#react-query#server-state#infinite#v5
One-click install
npx skills add https://github.com/geinala/entry --skill tanstack-query-geinala
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tanstack-query
Source: https://github.com/geinala/entry/tree/main/.agents/skills/tanstack-query
Command: npx skills add https://github.com/geinala/entry --skill tanstack-query-geinala

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) and assets (resource) components.

What problem does it solve?

TanStack Query v5 provides a robust framework for managing server state in React applications by handling data fetching, caching, and synchronization across components, reducing boilerplate and improving UX.

Core Features & Use Cases

  • UseMutationState for cross-component mutation tracking and simplified optimistic updates.
  • Network mode controls offline/PWA behavior and SSR hydration stability.
  • infiniteQueryOptions and queryOptions factories for reusable, type-safe configurations.

Quick Start

Install a QueryClient and start using useQuery, useMutation, and useInfiniteQuery to implement resilient server-state patterns.

Frequently Asked Questions about tanstack-query

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

FAQPage Schema
How do I migrate TanStack Query from v4 to v5?▼

TanStack Query v5 migration requires enforcing object-syntax usage, adopting infiniteQueryOptions factories, and replacing previous loading states with isPending to ensure reliable server-state hydration.

What is the best way to handle optimistic updates in React Query v5?▼

The best way to handle optimistic updates in React Query v5 is using the new useMutationState hook, which provides cross-component mutation tracking and simplifies complex UI synchronization.

How does TanStack Query handle SSR hydration and offline behavior?▼

TanStack Query handles SSR hydration and offline behavior using network mode controls and placeholderData strategies, ensuring stable server-state rendering and reliable PWA functionality.

How do I configure infinite queries in React Query v5?▼

You configure infinite queries in React Query v5 by utilizing the infiniteQueryOptions factory to create reusable, type-safe configurations for useInfiniteQuery across complex UIs.

When should I use isPending instead of isLoading in TanStack Query?▼

You should use isPending instead of isLoading in TanStack Query v5 specifically for initial loading states, enforcing object-syntax to ensure accurate server-state tracking and reliable hydration.

Related Skills

Explore More Software Engineering Skills→
PostHogPostHog
58

instrument-integration

Instrument PostHog SDKs across popular web and mobile frameworks with verified configuration.

Official
Advanced
mgd34msumgd34msu
4

tanstack-query

Manage React server state with TanStack Query data fetching, caching, and mutations.

Community
Intermediate
chemicallangchemicallang
28

universal

Diagnose and fix SSR and hydration mismatches across React, Preact, and Solid components.

Official
Advanced
michsindlingermichsindlinger
1

State Management

Implements scalable state management patterns for React, Vue, and Angular applications.

Community
Advanced