npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

blazeplot

v1.0.1

Published

Real-time LOD time series rendering engine for the browser.

Readme

Sponsor npm version npm downloads license previews

BlazePlot is for datasets that outgrow general-purpose charting libraries: millions of points, live streams, and dense zoomable views. It draws on the GPU through raw WebGL2 with no rendering runtime dependency and falls back to Canvas 2D on its own when WebGL2 is unavailable (renderer: "auto" is the default). The DOM is used only for axis labels and optional plugin UI.

Live previews | Documentation | Examples | Benchmarks

Installation

bun add blazeplot
# or: npm install blazeplot

Works in Chrome and Edge 93+, Firefox 92+, and Safari 15.4+. WebGL2 is used when available and Canvas 2D otherwise, with nothing to configure (see Browser support). Using React, Vue, Svelte, or an SSR framework? See Framework integration.

Quick start

A chart needs a sized host element and the Chart constructor. Add the optional plugins you want from blazeplot/plugins/*.

import { Chart } from "blazeplot";
import { interactionsPlugin } from "blazeplot/plugins/interactions";
import { tooltipPlugin } from "blazeplot/plugins/tooltip";

const el = document.getElementById("chart"); // give it an explicit height, e.g. 400px
if (!el) throw new Error("Missing #chart host");

const x = Array.from({ length: 1000 }, (_, i) => i);
const y = x.map((value) => Math.sin(value * 0.02));

const chart = new Chart(el, { theme: "auto", plugins: [interactionsPlugin(), tooltipPlugin()] }); // theme: "auto" follows prefers-color-scheme
chart.addLine({ x, y, name: "sine" });
chart.fitToData();
chart.start();

// Later, when the page, component, or panel is removed:
chart.dispose();

For streaming data, pass capacity to addLine and append samples; see Live data. More recipes are in Examples.

Performance

The core runtime (import { Chart } from "blazeplot", without optional plugins) is about 209 KiB raw. Plugins and helpers ship as separate subpath entries.

Across 19 scenarios and 154 metric comparisons against uPlot and Chart.js, BlazePlot (WebGL) clearly wins 117, is within noise on 13, and loses 24.

Measured 2026-10-05 on AMD Ryzen 7 7800X3D 8-Core Processor, AMD Radeon RX 9070 (0x00007550) Direct3D11 vs_5_0 ps_5_0, Chrome/153.0.8010.12, 7 fresh-page runs per cell. The per-scenario tables, spreads, and every scenario where BlazePlot does not clearly win are in docs/benchmarks.md. Reproduce with bun run bench:compare.

Features

  • WebGL2 rendering with a Canvas 2D fallback. GPU-accelerated plots by default, falling back to Canvas 2D when WebGL2 is unavailable (renderer: "auto", the default). Axis labels and grid use lightweight DOM layers and DPR-aware sizing.
  • Many charts on one page. renderer: "shared" draws every chart through one WebGL context, so dashboards are not limited by the browser's per-page context cap.
  • Series types. Line, area, scatter, bar, histogram (addBar with HistogramDataset), OHLC, and candlestick, each with independent data, style (series.setStyle), and visibility.
  • Live and large data. Streaming ring buffers (including fixed-rate UniformRingBuffer), static typed arrays, and a custom dataset contract for remote or procedural sources.
  • Level-of-detail downsampling. Min/max extraction keeps dense views accurate and cheap at any zoom; ServerSampledDataset renders server-reduced buckets directly.
  • Plugins. Legend, tooltip, interactions (pan, zoom, reset, keyboard, touch), annotations, selection, crosshair, navigator, accessibility, and flame graph, built on the same public APIs available to custom plugins. Touch pan is cooperative by default (one finger scrolls the page, two fingers pan and pinch), and wheelZoom: "modifier" keeps the wheel for page scrolling.
  • Accessibility. Charts are named figures with a generated data summary, focus rings, and forced-colors support; interactionsPlugin adds keyboard pan/zoom, and blazeplot/plugins/a11y adds a hidden data table and a keyboard inspection cursor. Built-in text can be localized (see Accessibility).
  • Linked charts. blazeplot/linked synchronizes multi-panel layouts.
  • Export. chart.screenshot(), CSV/JSON data export, and pure transform helpers (see Export image and data).
  • Diagnostics. chart.getFrameStats() reports fps, frame time, rendered points, draw calls, upload bytes, and render mode.

Documentation

Guides: Overview, Docs map, Examples, Frameworks, Live data, Data semantics, Performance, Benchmarks, Plugins, Theme & layout, Author plugins, Troubleshooting, Browser, Migrating to 1.0, Migration, Stability, Errors, Accessibility, Roadmap.

Package entry points

| Import | Contents | |---|---| | blazeplot | Chart, datasets, data contracts, theming, and renderer selection. | | blazeplot/linked | Multi-panel layouts with shared X and per-panel plugins. | | blazeplot/data | Pure, chart-agnostic data transforms (binning, rolling mean). | | blazeplot/export | Chart data export (CSV/JSON-ready rows) and screenshot download/clipboard helpers. | | blazeplot/plugins/legend | Built-in legend plugin. | | blazeplot/plugins/tooltip | Built-in tooltip plugin. | | blazeplot/plugins/interactions | Built-in pan, zoom, axis interaction, and reset plugin. | | blazeplot/plugins/annotations | Built-in annotation overlay plugin. | | blazeplot/plugins/selection | Built-in brush/range selection plugin. | | blazeplot/plugins/crosshair | Built-in crosshair and ruler plugin. | | blazeplot/plugins/navigator | Built-in overview/navigator plugin. | | blazeplot/plugins/flamegraph | Built-in flame graph and status-span plugin. | | blazeplot/plugins/a11y | Built-in accessibility plugin: hidden data table, keyboard inspection cursor, live summary. |

Every public export (with kind and summary) and the per-chunk bundle sizes are listed in the API reference.

Development

bun install
bun run dev        # docs and previews site
bun test           # unit tests
bun run typecheck  # strict TypeScript check
bun run lint       # oxlint
bun run build      # package build (JS + declarations)
bun run ci         # full local CI: checks plus browser tests

Open feature and fix PRs against main; releases are separate version-bump PRs. See Release and benchmarks and Documentation contributions for the full workflow.

License

MIT. See LICENSE.