TanStack Charts 是 Tanner Linsley 和 TanStack 团队推出的最新库,它以框架无关的 TypeScript 可视化图形语法亮相。尽管官方仍将其标记为 Alpha 阶段,其每周下载量已经达到约 16 万次。
TanStack Charts 没有提供固定的图表组件目录,而是采用了由 Leland Wilkinson 确立的图形语法传统。开发者不再选择某种图表“类型”,而是组合标记、比例尺、通道、变换和图层。其运行时是一套独立实现,不过它的标记与通道 API 最接近 Observable Plot。该库的一项突出特点是,推断出的类型会始终与源数据行保持关联,因此每个标记都可以直接读取数据的结构。同一份定义可以通过适配器在 React、Preact、Vue、Solid、Svelte、Angular、Lit 和原生 DOM 宿主中渲染,并可运行于服务器或浏览器。
安装只需要一个软件包,即 pnpm add @tanstack/charts;使用 React 适配器时,还需要将 react 和 react-dom 添加为对等依赖,具体说明见安装文档。
在 Reddit 上,用户对此表现得十分兴奋,其中一位评论者谈到了 TypeScript 使用体验:
这个人简直以 TypeScript 为生。所有 TanStack 库的开发者体验都非常出色!
另一位用户询问是否支持 React Native:
请支持 React Native!RN 图表库的现状实在太糟糕了。
Linsley 本人回复道:
我们有一个实验性的 RN 适配器。试试看!文档里有介绍。
Linsley 在发布推文中称它是“我一直梦想拥有的图表库”。他还通过 11 个版本、188 个示例、完整的 shadcn 图表目录、多坐标轴、极坐标比例尺和可下钻旭日图,宣布该项目正式进入 Alpha 阶段。YouTube 上的演示视频,例如《TanStack 又做到了……他们修好了图表》,进一步扩大了此次发布的影响。
此次发布中有一个细节值得关注,那就是该库的构建方式。Linsley 在 GitHub 页面上表示,“几乎所有实现都是由 AI 编码智能体在我的直接监督下完成的”,之后再经过审查并被项目接受。
商业竞争对手 SciChart 发布的一篇对比文章认为,TanStack“通常更适合创建不需要实时处理庞大复杂数据集的简单图表”,并建议对繁重的实时工作负载使用硬件加速渲染器。该项目自己的大数据指南也坦率地承认了这一点,指出 Canvas 可以消除 SVG DOM 开销,但无法消除比例尺、辅助元素或场景编译方面的工作。
一个基础 React 折线图经过压缩和 gzip 处理后的大小约为 29 kB。该项目自己的对比显示,其受控测试套件的大小约为 38 至 45 KiB;Chart.js 约为 45 至 58 KiB,Observable Plot 约为 83 至 92 KiB,Apache ECharts 约为 153 至 173 KiB,而 AG Charts 的体积则要大得多。
稳定性指南指出,Alpha 阶段“并不意味着对 API 稳定性的承诺”,并建议固定使用确切版本。代码仓库仍然警告称,该项目尚未做好用于生产环境的准备。准备迁移的团队应该阅读迁移指南。
TanStack 是由 Tanner Linsley 创建的一系列开源、无头且类型安全的库,涵盖 Query、Table、Router、Form 和全栈框架 Start,并被数百万个应用程序所依赖。Charts 将这种无头方式扩展到了数据可视化领域。它采用 MIT 许可证发布,可免费使用。
原文链接:https://www.infoq.com/news/2026/09/tanstack-charts-alpha-introduced/