What It Does
TanStack Table (formerly React Table) is a headless table and data-grid library. “Headless” means it provides all the logic — sorting, filtering, pagination, column resizing, row selection, grouping, column visibility, column pinning — as pure functions and hooks, but produces no DOM output of its own. You write the JSX/HTML/CSS that renders the table; TanStack Table manages the state and transformation pipelines.
This approach decouples data-grid logic from design systems, making it the practical choice when teams need to match a custom design, integrate with a specific component library, or build accessible tables that conform to their organization’s UI standards. The flip side is that all UI work is your responsibility.
Key Features
- Complete headless architecture — zero DOM output; adapters for React, Vue, Solid, Svelte, Angular, Qwik, vanilla JS
- Sorting (multi-column, custom sort functions, stable sort)
- Filtering (global filter, per-column filter, custom filter functions)
- Pagination (client-side; server-side compatible via manual state control)
- Row selection (single, multi, with checkboxes)
- Column resizing with pixel or percentage modes
- Column pinning (left/right sticky columns)
- Column visibility toggling
- Grouping and aggregation for grouped row display
- Row expansion for sub-row trees
- Virtualization-ready — pairs with TanStack Virtual for windowed rendering of large datasets
- TypeScript-first with inferred column definition types
Use Cases
- Use case 1: Enterprise data tables requiring pixel-perfect compliance with a design system — headless means full markup control
- Use case 2: Multi-framework teams where the same table logic must be shared across React and Vue apps
- Use case 3: Tables with up to ~50K rows (client-side) paired with TanStack Virtual for windowed rendering
- Use case 4: Projects where AG Grid or MUI DataGrid licensing cost is prohibitive and the team can invest engineering time in the UI layer
- Use case 5: Design system libraries needing a table primitive with full style control
Adoption Level Analysis
Small teams (<20 engineers): Fits if the team has the bandwidth to build the UI layer. A simple CRUD table can be built in hours; a production-quality table with accessibility, responsive behavior, and all interaction states can take days. Evaluate whether a pre-built solution (MUI DataGrid, Mantine Table) reduces total effort.
Medium orgs (20–200 engineers): Good fit when you have a design system team. The headless approach aligns well with component library development. Teams without a dedicated design system effort should weigh the ongoing maintenance of a custom table against an opinionated pre-built alternative.
Enterprise (200+ engineers): Fits as the foundation for internal design system table components. Many enterprise teams wrap TanStack Table in a company-specific <DataTable> component that pre-wires their design tokens and behaviors. For very large datasets (100K+ rows), complex server-side operations (grouping, pivoting, Excel-like interactions), or teams needing SLA-backed vendor support, AG Grid Enterprise remains the stronger choice despite licensing cost.
Alternatives
| Alternative | Key Difference | Prefer when… |
|---|---|---|
| AG Grid Community | Batteries-included opinionated grid, MIT licensed, but heavier (~200KB+) | Need out-of-the-box feature richness without writing UI code |
| AG Grid Enterprise | Full pivot, Excel export, charting, SLA support | Complex analytical tables, enterprise SLA requirements |
| MUI DataGrid (free tier) | Pre-built Material Design table for React | MUI-based design system already in use |
| React Data Grid (Adazzle) | Feature-complete, spreadsheet-like interactions | Teams needing Excel-style cell editing without AG Grid cost |
Evidence & Sources
- TanStack Table GitHub — 25k+ stars
- AG Grid and TanStack Table open-source partnership announcement
- TanStack Table vs AG Grid — comprehensive comparison (Simple Table)
- AG Grid vs TanStack Table — AG Grid perspective
Notes & Caveats
- UI cost is real: Teams routinely underestimate the engineering investment for a production-quality headless table. Accessibility (ARIA roles, keyboard navigation, screen reader announcements), responsive column hiding, and column resize handles all require custom implementation.
- Virtualization not built in: For large datasets, TanStack Table must be paired with TanStack Virtual or a similar windowing library. The integration is well-documented but adds another dependency.
- AG Grid partnership: AG Grid and TanStack Table have formalized an open-source partnership. TanStack Table’s official docs link to AG Grid for enterprise use cases. This is a healthy division of responsibility, not a competitive threat.
- Server-side operations: Pagination, sorting, and filtering can be handed off to the server via manual state control, but this requires careful wiring. There is no built-in “server mode” like AG Grid provides — the team must manage the state lifecycle themselves.
- v8 (current) API differs from v7: The v7→v8 rewrite changed the API substantially. Community tutorials predating v8 are misleading. Verify documentation currency when following third-party guides.