Masif Kadapa
← Back to work
00120256 months

Aperture

Rebuilding a fintech dashboard — cutting time-to-insight from minutes to seconds.

RoleLead frontend engineer
Timeline6 months
StackReact · TypeScript · D3 · WebGL
Context

Aperture is a portfolio-intelligence product finance teams rely on to read live market data. The legacy app rendered nine interconnected dashboards whose filtering layer serialised every query on the main thread.

The problem

A dashboard could sit 'loading' for up to 90 seconds. Deep-linking to an exact filter state was impossible, so analysts kept two tabs open and reconciled by eye.

How it was solved
  1. 01

    Audited the render path and traced 74% of blocking time to re-painting off-screen DOM rather than fetching data.

  2. 02

    Replaced full re-renders with a virtualised, query-driven grid that only paints the visible change.

  3. 03

    Moved cross-filters into a Web Worker so selections never occupy the main thread.

  4. 04

    Standarised charts on a token-based layer that stays in sync with the design system.

The detail worth mentioning
One canvas layer renders the entire candlestick series; a WebGL pass holds 1M+ points at 60fps while a lightweight D3 overlay keeps axes razor-crisp.
Outcome

6.2×faster

interactive on 1M-row cross-filtered datasets

  • Interactive load-time fell from ~90s to 2.4s at the p95.
  • Each PR now renders a full visual regression of the query surface.
  • The chart library now powers three other products in the company.