Architecture
OpenAlgo Charts 2.3.2 is a browser charting engine with no runtime dependencies. Each pane has a base canvas for chart content and an overlay canvas for transient interaction. You can build your own interface or use the optional widget tier.
What changed since 1.9.2
| Area | Current architecture |
|---|---|
| Navigation | Version 2.1.8 normalizes wheel units, routes gestures by axis and eases automatic price projections. The widget adds touch controls that follow container width and pointer type. |
| Data loading | Version 2.1.6 shares request scheduling, cache snapshots, history paging, stream repair and loading states across widget and custom hosts. |
| Object management | Version 2.1.7 shares inventory and supported object actions across widgets and custom terminals. The Objects panel adapts to the chart’s container size. |
| Widget | Version 2.0 added createWidget: a packaged host with a toolbar, drawing rail, dialogs, shortcuts and persistence. |
| Rendering | Version 2.0 introduced the series backend interface, optional WebGL2 acceleration with Canvas 2D fallback, and vector SVG export. |
| Drawings | Version 2.0 added the versioned drawing model: paint order, separate text, per-level styling, multiple selection, and migrated state/clipboard documents. |
| Market profiles | Version 2.1 adds compact TPO glyphs, per-session split/unsplit overrides, open markers and a latest-close marker on the newest supplied session. |
| Depth integration | Version 2.0.1 corrected the requested depth subscription field. The current ladder supports tick grouping, demonstrated in the new depth guide. |
The diagram is a capability map. The seven rows describe responsibilities; the eight bundle tiers describe what an application imports.
The layers
Public API. createChart, addSeries, registerIndicator, event subscriptions
and takeScreenshot. See Core Concepts.
Rendering. An invalidation-aware render loop drives one base canvas and one
overlay canvas per pane, plus crosshair, axes, grid and themes.
Cursor-only work stays on the overlay canvas, and live updates are coalesced to
animation frames. The series pass on each pane goes through a render backend
port: the shipped Canvas2D backend is the default, the openalgo-charts/webgl
tier puts a WebGL2 backend behind the same port, and exportSVG runs the same
paint into a serialising context. See
Render Backends & SVG Export. A source-bar update currently repaints base content across
active panes, so Performance & Operations
covers the retained-history and canvas-memory budgets for sustained sessions.
Drawables. Chart types, indicators, drawing tools and primitives. Chart types, indicators and drawing tools use registries. Primitives extend the chart through attachment, rendering, lifecycle and hit-test contracts.
Shared model. One DataLayer merges every series onto a gapless logical index, a single time scale is shared across panes, and each pane owns its price scale. Transforms turn bars into Renko, Range, Point and Figure, Kagi, Line Break or Heikin Ashi.
Session. Replay, comparison, chart linking, keyboard shortcuts and the drawing controller.
Trade layer. Order engine with a state machine and OCO, a depth-of-market ladder with configurable tick grouping, and drag-to-modify. Grouping combines display rows; it does not change valid order prices. See Order Engine & Ladder and the depth demo.
Feeds and data. A headless shared loading controller, per-feed request scheduling, validated closed-bar cache snapshots, REST history, live WebSocket data, the trading API, a candle builder that folds ticks into OHLC, and full IANA timezone handling.
Where calculations and rendering run
The browser receives data from host-provided adapters. The DataLayer, indicators, transforms and profile calculations run in JavaScript on the CPU. The optional WebGL2 backend uses the user’s GPU to draw supported series, then composites them into the pane’s base canvas. It does not move indicator or profile calculations to the GPU. Axes, text, drawings and profile primitives continue to use Canvas 2D.
The homepage’s BTC/USD adapter and the simulated depth feed are website examples; applications supply their own data connections. They are not bundled market-data services. See Custom Data Feeds.
Bundle tiers
The base engine is what you always pay for. Everything else is a separate entry point exposing that feature’s APIs. Some tiers also register built-in indicators, chart types, drawing tools or rendering backends when imported. Unused optional tiers stay outside the base bundle.
| Tier | Brotli | Contents |
|---|---|---|
openalgo-charts | 77.23 KB | Engine, 13 chart types, panes and scales, primitives, registries, chart state, linking, bar cache, trading overlay, SVG export, render backend port, feeds |
openalgo-charts/widget | 42.41 KB | Packaged interface controls through createWidget: top bar, drawing rail, mobile controls, status line, dialogs, right-click menu, keymap and persistence |
openalgo-charts/indicators | 28.19 KB | 102 built-ins, shared TA helpers, and the Tier-2 external-data contract |
openalgo-charts/draw | 34.53 KB | 85 drawing tools, headless controller, clipboard, settings schema |
openalgo-charts/profile | 14.96 KB | Volume Profile, Market Profile (TPO), Footprint, order flow |
openalgo-charts/trade | 7.61 KB | Order, position and bracket tools, DOM ladder |
openalgo-charts/webgl | 6.38 KB | WebGL2 series backend, composited into the pane’s canvas, 2D fallback for the session on context loss |
openalgo-charts/transform | 4.44 KB | Heikin Ashi, Renko, Range, Line Break, Point and Figure, Kagi, symbol arithmetic |
215.76 KB Brotli for every tier at once; a widget terminal (base + draw +
indicators + widget, what one createWidget call loads) is 182.37 KB. Figures are
the measured size-limit output and are enforced in CI, so a change that grows a
bundle past its budget fails the build.
The widget is a packaged host that drives the seven capability layers through the same public API as your own interface. The base engine creates its canvas and container elements; the widget adds the toolbar, dialogs and other interface controls. See The Widget Tier.
Custom indicators
The 102 built-ins are not special-cased. Each one is a descriptor: inputs, plots and
a calc function, optionally with markers, draws, levels, background,
barColors, fills, alerts and a table. Anything you register through
registerIndicator uses exactly the same contract and gets the same treatment,
including generated settings, legend entries and state persistence.
No fork, and no build step. See Indicators for the contract.