TanStack Table

Name: TanStack Table
Availability: InStock
Author: matiacone

Configure TanStack Table for server-side pagination, filtering, and sorting in React apps.

Updated Aug 23, 2026

Search Tags:#tanstack #pagination #server-side #virtualization #table #react-table #cloudflare-d1

Ready to run

npx skills add https://github.com/matiacone/dotfiles --skill tanstack-table-matiacone

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: TanStack Table
Source: https://github.com/matiacone/dotfiles/tree/main/agents/.agents/skills/tanstack-table
Command: npx skills add https://github.com/matiacone/dotfiles --skill tanstack-table-matiacone

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

TanStack Table provides a headless data table solution that enables scalable server-side pagination, filtering, and sorting.

Core Features & Use Cases

Server-side pagination, filtering, and sorting: Offload heavy data operations to backends to support large datasets.
Cloudflare D1 integration: End-to-end examples with Workers API and D1 for data sources.
Virtualization support: Efficient rendering of 1000+ rows with TanStack Virtual.
Type safety and UX reliability: Strong TypeScript column definitions and safe data handling.

Quick Start

Install the required packages and memoize data and columns, then configure TanStack Table with manual server-side features for pagination, filtering, and sorting.

Frequently Asked Questions about TanStack Table

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

FAQPage Schema

How do I implement server-side pagination and sorting with TanStack Table?▼

You can use TanStack Table with Cloudflare D1 by connecting a React frontend to a Cloudflare Workers API. The Workers API queries the D1 database to provide scalable data sources for server-side table operations.

How do I render thousands of rows in a React table without performance issues?▼

Rendering thousands of rows efficiently requires virtualization support using TanStack Virtual. This technique integrates with TanStack Table to render only visible rows, ensuring smooth performance for data-intensive dashboards.

Can I integrate TanStack Query with TanStack Table for data fetching?▼

Yes, TanStack Query can be integrated with TanStack Table to manage server-side data fetching. This combination handles asynchronous data operations for pagination, filtering, and sorting while maintaining type-safe column definitions.

What are type-safe column definitions in TanStack Table?▼

Type-safe column definitions in TanStack Table use strong TypeScript typing to ensure safe data handling and UX reliability. They define the structure of your table data securely within React-based applications.