InfoQ HomepageNewsTanStack Charts Introduced with a Framework Agnostic Grammar of Graphics for TypeScript
Web Development
<a href="https://certification.qconferences.com/ai-assisted-engineering?utm_source=infoq&utm_medium=referral&utm_campaign=infoqyellowbox_onlinecohortaiassistedengineering26″ rel=”nofollow noopener” target=”_blank”>InfoQ Certified AI-Assisted Engineering Program (online, Oct 19): Build the harness that holds.
TanStack Charts Introduced with a Framework Agnostic Grammar of Graphics for TypeScript
Sep 17, 2026
2
min read
TanStack Charts, the newest library from Tanner Linsley and the TanStack team, has arrived as a framework-agnostic visualization grammar for TypeScript, and it is already pulling roughly 160,000 weekly downloads while still officially in Alpha.
Rather than shipping a fixed catalogue of chart components, TanStack Charts adopts the grammar of graphics tradition established by Leland Wilkinson. Developers compose marks, scales, channels, transforms, and layers instead of picking a chart “type”. The runtime is an independent implementation, although its marks-and-channels API is closest to Observable Plot. A defining detail is that inferred types stay connected to the source row, so each mark reads directly from your data shape. The same definition renders through adapters for React, Preact, Vue, Solid, Svelte, Angular, Lit, and a vanilla DOM host, on the server or in the browser.
Installation is a single package, pnpm add @tanstack/charts, with react and react-dom added as peers for the React adapter, as covered in the installation docs.
On Reddit, users are excited, with one commenting on the TypeScript experience:
This guy breathes typescript. The developer experience of all the tan stack libraries is phenomenal!
Another asked about React Native support:
React Native support please! The state of chart libraries in RN is abysmal
We have an experimental RN adapter. Give it a try! It’s in the docs.
In the release tweet, Linsley described it as “the charting library I always dreamed of”. He also marked the official move to Alpha with 11 releases, 188 examples, a full shadcn chart catalog, multiple axes, polar scales, and drillable sunbursts. YouTube walkthroughs such as “TanStack Did It Again… They Fixed Charts” have amplified the launch.
One detail from the launch worth paying attention to is how the library was built. Linsley states on the GitHub page that “almost all of the implementation was produced with AI coding agents under my direct supervision”, then reviewed and accepted into the project.
A comparison from SciChart, a commercial competitor, argued that TanStack is “often better suited for simpler chart creations that don’t require huge, complex data sets to be processed in real-time”, steering heavy real-time workloads toward hardware accelerated renderers. The project’s own large data guide is candid on the same point, noting that Canvas removes SVG DOM cost but not scale, guide, or scene compilation work.
A basic React line chart weighs about 29 kB minified and gzipped, and the project’s own comparison puts its controlled suite around 38 to 45 KiB, against roughly 45 to 58 KiB for Chart.js, 83 to 92 KiB for Observable Plot, 153 to 173 KiB for Apache ECharts, and far larger figures for AG Charts.
The stability guide states that Alpha “is not a stable API promise” and advises pinning an exact version, and the repository still warns that it is not ready for production. Teams moving across should read the migration guide.
TanStack is the family of openpanning Query, Table, Router, Form, and the full-stack Start framework, and depended on across millions of applications. Charts extends that headless approach to data visualization. It is released under the MIT license and free to use
