resolvcharts 0.2.0 → 0.4.0

package/README.md

@@ -3,10 +3,12 @@
 [![npm](https://img.shields.io/npm/v/resolvcharts)](https://www.npmjs.com/package/resolvcharts)
 [![license](https://img.shields.io/npm/l/resolvcharts)](./LICENSE)
 
-A minimal, zero-dependency canvas charting library. Opinionated defaults, small API, fast rendering.
+A minimal, zero-dependency charting library. Small API, super fast rendering.
 
 At [Resolvo Cloud](https://resolvocloud.com), we experienced glitchy live charts, bloated libraries and just overcomplicated processes for something as simple as charting, so we made ResolvCharts to Resolve that issue.
 
+The result? A Lightweight library, with our benchmarks showing over 30x faster rendering than alternative charting solutions we've explored.
+
 ## Install
 
 ```sh
@@ -44,9 +46,14 @@ The `data` shape depends on `type` — pick the row you need:
 | `baseline` | `{ x, series: [{ y }] }` | Delta vs a reference value |
 | `sparkline` | `{ x, series: [{ y }] }` | Tiny inline chart, no axes |
 | `scatter` | `{ x, series: [{ y }] }` | Point clouds |
+| `bubble` | `{ x, series: [{ y, r }] }` | Scatter + radius channel |
+| `rangearea` | `{ x, series: [{ y, y2 }] }` | Min–max band, confidence intervals |
 | `bar` | `{ categories, series: [{ values }] }` | Categorical groups; `stacked` supported |
 | `combo` | `{ categories, series: [{ values, kind }] }` | Columns + line/area overlay |
+| `radar` | `{ categories, series: [{ values }] }` | Multi-axis polygon comparison |
+| `funnel` | `{ categories, series: [{ values }] }` | Stage drop-off (first series) |
 | `donut` | `{ slices: [{ label, value }] }` | Share of a total |
+| `pie` | `{ slices: [{ label, value }] }` | Donut without the hole |
 | `candle` / `ohlc` | `{ candles: [{ x, open, high, low, close, volume? }] }` | Financial OHLC (+ volume band) |
 | `waterfall` | `{ categories, values, totals? }` | P&L bridges, signed deltas |
 
@@ -102,11 +109,41 @@ createChart(el, {
   data: { x: [0, 1, 2], series: [{ y: [-2, 4, -1] }] },
 });
 
-// Donut
+// Donut / pie — same data, "pie" fills to the center
 createChart(el, {
   type: "donut",
   data: { slices: [{ label: "A", value: 40 }, { label: "B", value: 60 }] },
 });
+
+// Bubble — per-point `r` scales circle radius
+createChart(el, {
+  type: "bubble",
+  data: { x: [0, 1, 2], series: [{ label: "A", y: [3, 7, 5], r: [4, 12, 8] }] },
+});
+
+// Range area — band between `y` (lower) and `y2` (upper)
+createChart(el, {
+  type: "rangearea",
+  data: { x: [0, 1, 2], series: [{ label: "Temp", y: [10, 12, 11], y2: [18, 21, 19] }] },
+});
+
+// Radar — one axis per category
+createChart(el, {
+  type: "radar",
+  data: {
+    categories: ["Speed", "Power", "Range", "Cost"],
+    series: [{ label: "A", values: [8, 6, 7, 9] }],
+  },
+});
+
+// Funnel — stage widths follow the first series' values
+createChart(el, {
+  type: "funnel",
+  data: {
+    categories: ["Visit", "Signup", "Trial", "Paid"],
+    series: [{ label: "Users", values: [4200, 1800, 620, 240] }],
+  },
+});
 ```
 
 ## Options
@@ -128,7 +165,7 @@ Universal:
 | `labels` | — | `{x?: (v)=>string, y?: (v)=>string}` tick formatters |
 | `onHover` | — | `(info \| null) => void` |
 
-xy charts (`line` `area` `scatter` `sparkline` `baseline`):
+xy charts (`line` `area` `scatter` `bubble` `rangearea` `sparkline` `baseline`):
 
 | Option | Default | Description |
 |---|---|---|
@@ -196,6 +233,19 @@ The viewport (x/y domain) animates toward the new domain on every `append()` —
 - Zero-allocation streaming — steady-state `append()` reuses buffers via `copyWithin` and buffer ping-pong
 - O(n) monotonic fast path — already-sorted data skips the index sort entirely
 
+### Benchmarks
+
+Same machine, browser, data, and chart size (900×240, two series). Methodology and full tables: [BENCHMARK_COMPARISON.md](./BENCHMARK_COMPARISON.md).
+
+| | resolvcharts | Chart.js 4.5 | ApexCharts 8.3 | Highcharts 13.1 |
+|---|---|---|---|---|
+| Line render, 1M pts ×2 | **0.20 ms** | 136–1380 ms | 484 ms | 248–3194 ms |
+| Streaming, 50k window | **120 fps** | 15 fps | 17 fps | 13 fps |
+| Bundle (gzip) | **21.4 KB** | 70.7 KB | 269.8 KB | 102.3 KB |
+
+Chart.js range = built-in decimation on/off; Highcharts range = WebGL boost module on/off. Even the Canvas2D fallback (3.5 ms at 1M) is ~39× faster than the best competitor configuration.
+
+Last benchmarked as of Oct 18, 2026
 ---
 
 A project by [Resolvo Cloud](https://resolvocloud.com)