How does it handle TypeScript integration?

It promotes the use of the Query Options API and TypeScript inference for maximum type safety across imperative and declarative methods.

Can it help with cache invalidation?

Absolutely. It implements hierarchical query key factories to make cache invalidation and synchronization predictable and efficient.

Does this skill support the latest TanStack Query v5 features?

Yes, it is specifically designed for version 5, covering the single object signature, renamed options, and first-class Suspense support.

Does it include patterns for optimistic updates?

Yes, it provides detailed patterns for mutations that include manual cache updates to provide instant user feedback during network requests.

TanStack Query v5 Patterns

Name: TanStack Query v5 Patterns
Author: tianzecn

bytianzecn

•

API開発

Implements production-ready TanStack Query v5 patterns for efficient server state management and type-safe data fetching.

概要

This skill provides a comprehensive implementation framework for TanStack Query v5, focusing on modern async state management patterns. It guides users through the transition from v4 to v5, including the single object signature, hierarchical query key factories, and first-class Suspense integration. By leveraging these patterns, developers can ensure type-safe data fetching, optimized cache invalidation, and robust error handling while avoiding common anti-patterns in React applications.

主な機能

Advanced mutation patterns with support for optimistic updates and invalidation
Type-safe data transformation using the Query Options API and select pattern
Multi-layer error handling strategies covering component, global, and boundary levels
Hierarchical Query Key Factory implementation for structured cache management
Comprehensive v5 migration patterns including single object signature and renamed options
1 GitHub stars

ユースケース

Implementing high-performance UI updates using optimistic state transitions and Suspense
Establishing a feature-based colocation architecture for scalable data fetching logic
Migrating React applications from React Query v4 to TanStack Query v5 with codemod support

概要

主な機能

Advanced mutation patterns with support for optimistic updates and invalidation
Type-safe data transformation using the Query Options API and select pattern
Multi-layer error handling strategies covering component, global, and boundary levels
Hierarchical Query Key Factory implementation for structured cache management
Comprehensive v5 migration patterns including single object signature and renamed options
1 GitHub stars

ユースケース

Implementing high-performance UI updates using optimistic state transitions and Suspense
Establishing a feature-based colocation architecture for scalable data fetching logic
Migrating React applications from React Query v4 to TanStack Query v5 with codemod support