skills.rest
acedergren
acedergrenCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

tanstack-query

Diagnose TanStack Query v4 to v5 migration issues and provide remediation steps.

22|3|Updated Jan 8, 2026
Search Tags:#debugging#migration#ssr#react-query#hydration#invalidation#tanstack-query
One-click install
npx skills add https://github.com/acedergren/agentic-tools --skill tanstack-query-acedergren
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tanstack-query
Source: https://github.com/acedergren/agentic-tools/tree/main/skills/tanstack-query
Command: npx skills add https://github.com/acedergren/agentic-tools --skill tanstack-query-acedergren

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides expert troubleshooting for TanStack Query v5, focusing on non-obvious production issues caused by v4→v5 migrations, performance pitfalls like infinite refetch loops, and hydration mismatches.

Core Features & Use Cases

  • Migration diagnostics: identify renamed or removed options (cacheTime → gcTime, isLoading → isPending, keepPreviousData → placeholderData) and provide concrete replacements.
  • Scoped invalidation & debugging: targeted query invalidation, detection of infinite loops, and strategies to minimize network requests.
  • SSR hydration & client/server patterns: guidance on prefetching, dehydrate/hydration boundaries, and avoiding hydration mismatches in Next.js apps.
  • Decision frameworks: guidance on when to use React Query vs SWR vs fetch, and when to rely on caching versus server state.
  • Operational playbooks: reproducible test steps, diagnostic checklists, and production-ready remediation steps.

Quick Start

  • Inspect code for v4→v5 migration gaps (e.g., cacheTime, isLoading, keepPreviousData) and replace with gcTime, isPending, placeholderData.
  • Run a migration audit with structured checks and apply targeted invalidation to minimize refetching.
  • Use the resource guides to align on SSR hydration patterns and choose the appropriate data-fetching strategy.

Frequently Asked Questions about tanstack-query

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

FAQPage Schema
How do I fix infinite refetch loops in TanStack Query v5?▼

Infinite refetch loops in TanStack Query v5 are resolved by implementing targeted query invalidation strategies and adjusting query key structures to minimize unnecessary network requests.

What are the TanStack Query v4 to v5 migration replacements for cacheTime and isLoading?▼

TanStack Query v4 to v5 migration replaces cacheTime with gcTime, isLoading with isPending, and keepPreviousData with placeholderData to align with the updated v5 API concepts.

How do I avoid hydration mismatches with SSR and React Query in Next.js?▼

Avoiding hydration mismatches with SSR and React Query requires configuring prefetching, setting proper dehydrate and hydration boundaries, and aligning server and client state rendering patterns in Next.js.

When should I use React Query versus SWR for data fetching?▼

Use React Query versus SWR based on your server state complexity, as React Query provides advanced caching, targeted invalidation, and structured hydration control compared to simpler data fetching alternatives.

Why is my TanStack Query stale data not updating after invalidation?▼

TanStack Query stale data fails to update after invalidation when query keys are mismatched, requiring targeted invalidation diagnostics to ensure the correct query cache is marked stale and refetched.

Related Skills

Explore More Software Engineering Skills→
masanao-ohbamasanao-ohba
2

react-query-patterns

Automate TanStack React Query server state patterns in TypeScript React projects.

Community
Intermediate
0xjc65eth0xjc65eth
4

debugger

Diagnose and fix bugs, memory leaks, and hydration mismatches in CYPHER V3.

Community
Advanced
TechsioCZTechsioCZ
2

implement-ssr-prefetch-and-query-client-boundaries

Prefetch and hydrate server-side query data in Next.js SSR.

Official
Advanced
AmbitionsXXXVAmbitionsXXXV
2

tanstack-query

Migrate React server-state management from TanStack Query v4 to v5.

Community
Advanced