vue-charts Why vccs
vccs suits Vue apps that want to build a chart from components and style it with CSS. It isn't the smallest option, and its speed with very large datasets isn't benchmarked here. The comparison site renders the same data in nine libraries side by side, with the code for each card, so you can judge for yourself.
What vccs is good at
- Components instead of a config object. A chart is
<BarChart>,<Bar>,<XAxis>and<Tooltip>, and you customize parts with slots. If you know Recharts, the API will feel familiar. - CSS theming. Default colors come from CSS variables, so dark mode needs no chart code.
- Server rendering. Charts render as SVG on the server, and
vccs/nuxtregisters everything in Nuxt. - Keyboard and screen readers. Charts have an accessible name, keyboard navigation and announcements.
- Coding agents. An official skill gives your agent guides that match your installed version.
Bundle size
First-load JavaScript and CSS for the same line chart, with Vue external. vccs is ranked with motion-v, its required animation peer.
| Rank | Library | Gzipped (KB) |
|---|---|---|
| 1 | TanStack Charts | 42.5 |
| 2 | Chart.js | 60.3 |
| 3 | Unovis | 69.3 |
| 4 | Observable Plot | 89.6 |
| 5 | vccs | 107.7 |
| 6 | vue-data-ui | 148.2 |
| 7 | Apache ECharts | 179.2 |
| 8 | Vega-Lite | 285.8 |
| 9 | AG Charts Community | 397.8 |
Measured on 2026-10-31. vccs alone is 82.2 KB when your app already ships motion-v.
Features
Each cell links to its source for the tested version. The full table has the scoring rule for each column and the details behind each answer.
| Feature | vccs | Chart.js | Apache ECharts | Unovis | TanStack Charts | AG Charts Community | vue-data-ui | Observable Plot | Vega-Lite |
|---|---|---|---|---|---|---|---|---|---|
| Rendering | SVG | Canvas | Canvas or SVG, chosen at init | SVG; Leaflet map components also use canvas | SVG by default; Canvas opt-in per mark | Canvas | SVG; VueUiXyCanvas draws to Canvas | SVG; HTML figure wrapper for legends, titles | SVG by default in vega-embed; Canvas optional |
| TypeScript | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes |
| SSR and Nuxt | Yes | No | Partial | Partial | Yes | No | Partial | Partial | Partial |
| Theming | Yes | Partial | Yes | Yes | Yes | Yes | Yes | Yes | Yes |
| Dark mode | Yes | Partial | Yes | Yes | Yes | Yes | Yes | Partial | Yes |
| Animated updates | Yes | Yes | Yes | Yes | Partial | No | Partial | No | No |
| Responsive | Yes | Yes | Partial | Yes | Yes | Yes | Partial | Partial | Partial |
| Composability | Yes | No | No | Yes | Partial | No | No | Partial | No |
| Accessibility | Yes | Partial | Partial | Partial | Yes | Yes | Partial | Partial | Partial |
| Tree-shaking | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Partial | No |
| Agent support | Yes | No | Partial | Yes | Yes | Yes | Partial | Unknown | No |
When another library suits you better
- Very large datasets: ECharts or Chart.js. vccs draws every mark as an SVG element, which adds up as points grow, so a Canvas library is worth trying. This comparison does not benchmark runtime speed yet, so test with your own data. Source
- The smallest first load: TanStack Charts, Chart.js, Unovis, Observable Plot. These measured smaller than vccs with motion-v for the same line chart. vccs alone is smaller if your app already ships motion-v. Source
- More than one framework: TanStack Charts or Unovis. vccs only works in Vue 3. Both of these have integrations for other frameworks, so several apps can share one charting library. Source
- Charts generated as data: Vega-Lite. A chart is a JSON specification, which a server or a data tool can produce and store without Vue code. Source
- Maps: ECharts or Unovis. vccs has no map chart. Source
- A vendor and paid support: AG Charts Enterprise. vccs is an unofficial, community-maintained port. AG Charts sells an Enterprise edition, which this comparison does not test. Source
How it was tested
The same data, each library's default look and its free edition only, at pinned versions. The harness lives in the repo, so you can reproduce the results. Runtime speed isn't measured yet.