Is it compatible with TanStack Query?

Absolutely. It includes patterns for keeping table state (filters, sorting, pagination) perfectly synced with your query keys for reliable data fetching.

How does it help with Cloudflare D1 integration?

It provides ready-to-use Worker API patterns for handling SQL-based pagination, search, and sorting directly within D1.

Does it include virtualization for large datasets?

Yes, it provides specific implementation patterns using @tanstack/react-virtual to handle over 1,000 rows efficiently.

What version of TanStack Table does this skill support?

This skill is optimized for TanStack Table v8, including the latest functional patterns and TypeScript definitions.

Can this skill help debug infinite re-render issues?

Yes, it identifies common mistakes in data and column memoization that lead to performance bottlenecks and browser freezes.

TanStack Table Mastery

Name: TanStack Table Mastery
Author: jezweb

byjezweb

•

117

•

设计工具

Builds high-performance headless data tables with server-side pagination, sorting, and virtualization for React and Cloudflare D1.

This skill provides Claude Code with expert-level implementation patterns for TanStack Table v8, specifically optimized for modern full-stack environments like Cloudflare Workers and D1. It focuses on solving complex state management challenges, such as synchronizing server-side pagination with TanStack Query, implementing row virtualization for large datasets, and preventing common performance bottlenecks like infinite re-renders through proper memoization. Whether you are building simple lists or complex administrative dashboards with grouped and pinned data, this skill ensures production-grade table architecture.

主要功能

01Advanced UI patterns for column/row pinning, grouping, and nested expansion

02117 GitHub stars

03Server-side pagination and filtering patterns for Cloudflare D1 databases

04High-performance row virtualization using TanStack Virtual for 1000+ rows

05Best-practice memoization strategies to prevent infinite re-render cycles

06Seamless integration logic for TanStack Query and React state synchronization

使用场景

01Optimizing frontend performance for applications displaying massive datasets

02Implementing efficient server-side data fetching for edge-computing environments

03Developing data-heavy administrative dashboards with complex sorting and filtering

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add jezweb/claude-skills tanstack-table

For use in Claude.ai and ChatGPT

主要功能

01Advanced UI patterns for column/row pinning, grouping, and nested expansion

02117 GitHub stars

03Server-side pagination and filtering patterns for Cloudflare D1 databases

04High-performance row virtualization using TanStack Virtual for 1000+ rows

05Best-practice memoization strategies to prevent infinite re-render cycles

06Seamless integration logic for TanStack Query and React state synchronization

使用场景

01Optimizing frontend performance for applications displaying massive datasets

02Implementing efficient server-side data fetching for edge-computing environments

03Developing data-heavy administrative dashboards with complex sorting and filtering