写点什么

TanStack Table V9 测试版:Tree-Shakable 特性、TanStack Store 状态与更低内存的使用

作者:Daniel Curtis
  • 2026-08-13
    北京
  • 本文字数:1202 字

    阅读完需:约 4 分钟

TanStack Table是一个用于在各种 JavaScript 框架中构建表格和数据网格的 headless UI 库,最近发布了TanStack Table V9 beta版本,该版本在保持开发者熟悉的核心表格逻辑的同时,重构了状态管理、内存使用、打包体积与可扩展性。

该 beta 版本于 2026 年 6 月 8 日通过X发布,引入了基于TanStack Store的状态管理、通过状态订阅实现的细粒度重渲染控制、大规模下更低的内存占用、带类型安全的可 tree-shake 特性、更清晰的插件模型以及重写的开发者工具。它支持 React、Preact、Angular、Solid、Vue、Svelte 和 Lit 等框架。

最显著的变化是特性现在改为按需注册。在 V8 中,所有特性会一起发布,但 V9 仅注册表格实际使用的部分,因此一个小表格可以只有大约 5 kb,而完整的企业级网格则可以在需要时引入排序、过滤和分页等功能。TypeScript 会强制执行这一点,因此,诸如setSorting之类的 API 仅在对应特性被注册后才存在。

另一个重要变化是状态管理。迁移指南说明,useReactTable变为useTable,状态现在通过table.statetable.store以及每个切片的 atoms 流动,而不再通过getState()。新的table.Subscribe允许行选择变化只重新渲染显示计数的组件,而不会触及表实例的所有控制项。主维护者 Kevin Van Cott 表示该设计直接借鉴自 TanStack Form 与 Store,并称 React Compiler 的稳定迫使他们进行重写,因为在 V8 的模式下已经“开始出现问题”。

Van Cott 对多年的延迟表现得非常坦率,承认该发布“似乎花费了太长的时间”,并表示试图一次性修复所有关于 V8 的抱怨是“一个大错误”,下一次会采取不同的做法。

Medium上的一篇文章中,Ahmad Fiaz 提醒说,“v9 测试版中的新 atoms API 并非对受控状态的直接替代,并且这一区别在 Angular 与 React 应用中同样重要。”可扩展性方面的工作也回应了一个反复出现的问题,在一条Reddit讨论中,有开发者形容在项目增长时,“与其说是在写代码,不如说我在折腾这个库”。

r/reactjs的公告中有一段交流反映了插件模型在用户中的接受情况。评论者 Arceus919 询问针对每个表的状态是否仍然是一个潜在的问题:

我看得没错的话,仍然没有针对每个表格的元数据(per-table meta),一切仍然是全局的 :我的应用中有很多功能密集型的表格,所以针对每个表格的元数据对我来说是必须的,我已经创建了自己的useTable hook来支持它,但希望有一天能切换过来

Van Cott 通过其刚刚发布的一个关于表和列元数据的功能以及指南进行了回应。

迁移设计为渐进式的。useLegacyTable hook 在 V9 之上能够接受 V8 风格的 API,而导入stockFeatures则以牺牲打包体积为代价恢复旧的全量包的行为。表的标记本身没有变化。

与 AG Grid 或 MUI X Data Grid 等商业方案相比,TanStack Table 保持 headless 且免费,像Material React Table这样的封装库则建立在底层框架之上。V9 目前处于测试阶段,该版本的定位是作为未来发布的基础。

查看英文原文:TanStack Table V9 Beta: Tree-Shakable Features, TanStack Store State, and Lower Memory