Back to Equivox v1.0

Market Data

Big finance platforms all have charts and moving red/green numbers, so Equivox leaned into market data too. In hindsight this diluted product focus, but technically the system architecture was solid and reusable across the app.

Each step pairs a heading and description with a decorative 3D preview of the Equivox UI. Those previews are skipped in screen reader navigation and are not interactive for assistive technology—the text beside each preview is authoritative.

Stock Pages

Company pages were a centralized page with tab-based navigation and conditional layout behavior. If one card failed, the grid could reflow to preserve symmetry instead of leaving broken spacing.

Overview tab:

  • Price chart with timeframe selectors (cache on page exit, invalidate every 5 minutes)
  • Latest news card
  • Top 5 Issues card (custom AI feature)
  • Ownership card (Institutional % vs Retail %)

Other tabs:

  • Posts: feed-style list of stock-tagged posts (e.g. $TSLA routes into /company/TSLA posts tab)
  • News: stock-specific news feed
  • Earnings: reported/expected results, beat or miss, and upcoming dates
  • Filings: SEC filing list with direct links

Markets at a Glance

Top Gainers

Top Losers

Stock Panel & Carousel

The stock panel on the feed page listed S&P 500 top gainers and losers with mini charts and day-scoped percentage change. Percent deltas were realtime, while the gainers/losers set refreshed hourly.

Wishlisted stocks have their own panel section. Since the panel sits to the right of the feed, market news appeared below it to keep the column visually balanced.

The stock carousel reused the same data model in a compressed format and was mounted on multiple pages below the global header.

Realtime Strategy

Our market data provider only allowed one live websocket, so I built a small relay service. The relay keeps that single upstream connection to the provider. Every Equivox client opens its own websocket to the relay instead of talking to the provider directly.

Each client tells the relay which tickers it wants. If a bunch of people open Tesla at once, they all subscribe to TSLA on their relay connection. The relay still only needs one matching subscription upstream. When a trade comes in for TSLA, the relay forwards that update to every client that asked for TSLA.

The relay subscribes to a symbol upstream when at least one client still needs it. It unsubscribes upstream when no clients need it anymore. That respects the one-socket limit and still gives the app live prices.