TanStack Table 9: A Framework-Agnostic Headless Datagrid with a Core That Does the Thinking

The Problem: Datagrid Logic Without the Markup

TanStack Table solves a recurring problem for teams that build data-dense interfaces: the logic of a table, sorting, filtering, grouping, aggregation, and row selection, is hard to get right, but the visual presentation is almost always project-specific. A component library that ships its own `<table>` tags and CSS classes forces you to fight its styling system. TanStack Table takes the opposite route. It provides no rendered output at all. Instead, it gives you a framework-agnostic core that computes the state and the transformations, and then you feed that state into your own JSX, Vue templates, or Svelte markup. The README calls it a "headless table library" and promises "full control over markup, styles, and behavior." The intended user is a developer who already has a design system or a specific UI library and needs the table logic to fit into it, not around it.

How the Core Works: One Engine, Many Adapters

The architecture is visible in the package list. There is `@tanstack/table-core`, which contains the framework-independent state machine and transformation pipeline, and then separate adapter packages like `@tanstack/react-table`, `@tanstack/vue-table`, and `@tanstack/svelte-table`. The core does not know what framework it is running in. It exposes a plain JavaScript API that returns table state, column definitions, and row models. The adapter packages wrap that core with framework-specific hooks or reactive wrappers. For React, you get a `useReactTable` hook. For Vue, a `useVueTable` composable. For Svelte, a store or a component wrapper. The README lists adapters for Angular, Lit, Preact, Octane, Ember, and Alpine as well. This means the sorting algorithm, the filtering logic, and the grouping rules are identical across frameworks. If you write a complex custom filter in one adapter, the same logic runs in another. That consistency is the main selling point, and it is a real one for teams that maintain multiple frontends.

Getting Started: Install, Then Run the Intent CLI

Installation is straightforward from the npm registry. For React, you would install `@tanstack/react-table`. For Vue, `@tanstack/vue-table`. The package names follow that pattern for every framework. The README does not show a full table setup example, so you will need the official docs at tanstack.com/table for the actual hook usage. What the README does highlight is a newer feature: TanStack Intent. After installing any v9 adapter, you run `npx @tanstack/intent@latest install`. This adds skill-loading guidance for AI coding agents like Claude Code, Cursor, or Copilot. The CLI also exposes `intent list` to browse available skills and `intent load <skill>` to print one for inspection. The skills are versioned with the library, so the guidance matches the exact version of the adapter you installed. This is a notable attempt to make AI-assisted development more reliable, but it is only available in v9 and above. If you are on v8, you do not get this tooling.

What It Does Not Do: Virtualization and Styling Are Your Job

The README lists "Lightweight, virtualizable & server-side friendly" as features, but note the wording. It says virtualizable, not virtualized. TanStack Table does not render only the visible rows for you. That is the job of a separate library, and the README points to TanStack Virtual in the ecosystem list. Similarly, there is no built-in pagination component, no default CSS, and no ready-made toolbar. You build those. For a simple admin panel with a few hundred rows, this is fine. For a grid with 100,000 rows, you must integrate TanStack Virtual yourself, which means more code and more testing. The same applies to server-side sorting and filtering. The core can be driven by server data, but the README does not describe a built-in server mode. You wire up the fetch calls and pass the data in. This is not a limitation for teams that already have a data-fetching layer, but it is a real cost for teams that expect a batteries-included datagrid.

The v9 Beta Question: Adopt Now or Wait?

The repository's default branch is `beta`, and the most recent releases are version 9.2.4 for `table-core`, `vue-table`, and `svelte-table`. That is a clear signal. TanStack Table 9 is in beta, and the README does not state a stable release date. The v8 line is the mature, widely used version, and it has a different API in some areas. The README mentions that TanStack Intent is only available for v9 and above, which suggests the v9 API is the future. But beta means breaking changes can arrive in a minor release. If you are building a production system, you have to weigh the benefit of the new API and the Intent tooling against the risk of API churn. The project is actively maintained, with a push on 2026-08-28, but active maintenance does not make a beta stable. Check the migration guide in the docs before you upgrade from v8, and pin your exact version in your lockfile.

The Alternative: AG Grid and the Trade-Off in Approach

The README lists AG Grid as a partner, which is an odd but telling detail. AG Grid is a full-featured datagrid that ships with its own rendering engine, built-in virtualization, cell editors, charts, and a theming system. It is a commercial product with a free community edition. The approach is the opposite of TanStack Table's. AG Grid gives you a complete grid component, and you configure it through props and callbacks. TanStack Table gives you logic only, and you build the grid. The difference matters when you need deep customization. With AG Grid, you are constrained by its component model, even though it is extensible. With TanStack Table, you have total freedom, but you also have total responsibility for performance and accessibility. For a team that needs a grid in a week, AG Grid is the faster path. For a team that needs a grid that matches a bespoke design system exactly, TanStack Table is the more flexible path. The README's partnership with AG Grid suggests coexistence rather than direct competition, but the architectural difference is fundamental.

Licence and Maintenance Cost

The project is licensed under MIT, which means you can use it in commercial products, modify it, and redistribute it without paying a fee. There is no copyleft obligation, so you do not have to open-source your own code. The maintenance cost is mostly your own. Because the library is headless, you own the rendering layer, the accessibility implementation, and the interaction details. The core logic is maintained by TanStack, and the release history shows regular updates, but you must track those releases and test your custom UI against them. The TanStack Intent skill system is designed to reduce the cost of onboarding AI agents, but it does not reduce the cost of writing and maintaining your table UI. The ecosystem also includes TanStack Virtual for virtualization, which you will likely need for large datasets. That is another dependency to version and upgrade. The total maintenance burden is higher than a monolithic grid library, but the flexibility is the payoff.

Editorial conclusion

Adopt TanStack Table 9 if you need a datagrid that works across React, Vue, Solid, Svelte, or other frameworks and you are comfortable building your own UI layer. Do not adopt it if you want a ready-made table with built-in styling, pagination controls, or virtualization; those are separate libraries. Before committing, verify that the v9 beta API matches your needs, check the migration guide from v8, and test the TanStack Intent CLI with your AI coding agent. The project is actively maintained with a recent release on 2026-08-28, but the default branch is still beta, so pin your version and read the changelog before upgrading.

Official sources

1. Official documentation
2. Official README
3. Project repository
4. Release notes