Skip to content

Add massive-heatmap: live cross-asset market heatmap demo#17

Open
Smartoneinok wants to merge 1 commit into
masterfrom
massive-heatmap
Open

Add massive-heatmap: live cross-asset market heatmap demo#17
Smartoneinok wants to merge 1 commit into
masterfrom
massive-heatmap

Conversation

@Smartoneinok

Copy link
Copy Markdown
Collaborator

What this adds

examples/websocket/massive-heatmap/ — a full-TypeScript, Finviz-style live market heatmap. Pick an asset class (Stocks, ETFs, Crypto, Forex, Indices, Futures) and a universe (e.g. S&P 500, Nasdaq 100); the screen fills with sector-grouped tiles, sized by market cap, colored by percent change versus the prior close, recoloring live by the second. A Capture button exports a branded PNG.

Architecture

  • Backend (Node + TS): uses the official @massive.com/client-js to poll a REST snapshot once for prior-close baselines, then streams per-second aggregates over one market WebSocket per asset class. Holds the API key server-side and pushes coalesced diffs (~5 Hz) to the browser. Bounded in-memory state (no growth).
  • Frontend (React + Vite): canvas treemap with a stable market-cap layout, recoloring on a requestAnimationFrame loop.

Verification

  • 22 unit tests pass (backend 14, frontend 8).
  • Live end-to-end run confirmed against Massive: crypto seeds 10/10 and streams live diffs; S&P 500 renders ~500 sector-grouped, cap-sized tiles in the browser with zero console errors.
  • Hardened against selectUniverse races, seed-failure rejections, and disconnect-during-seed (see commit history).

Known limitations

  • Universe membership and sectors ship as JSON in universes/ (a snapshot; periodic refresh). Market caps were sourced from Massive reference data.
  • Two S&P names (FI, MMC) resolved as NOT_FOUND on Massive and use a median-fallback cap.
  • The Futures universe is a work in progress: its symbols are product-root placeholders; Massive futures stream symbols are contract-specific (front-month) and need resolution before that universe streams.

Note on merging

Real-time WebSocket data requires an appropriate Massive plan. The master ruleset requires a ticket-prefixed or Bump squash-commit subject, so set the squash subject accordingly when merging.

🤖 Generated with Claude Code

…tmap

A Node + TypeScript backend with a React + Vite frontend that renders a
market-cap-weighted treemap colored by percent change across stocks, ETFs,
crypto, forex, indices, and futures. The backend holds the Massive API key
and brokers all data: it seeds prior-close baselines and serves current
prices over two REST endpoints (/api/snapshot, /api/prices), and the browser
polls on a configurable interval (2 to 60 seconds). Includes 18 prebuilt
universes, selectable lookbacks, session awareness, zoom and pan, hover
details, and branded PNG export.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant