Skip to content

Reduce chart hover layout and sorting work - #231

Merged
novykh merged 6 commits into
mainfrom
perf/surgical-dashboard-hot-paths
Jul 30, 2026
Merged

Reduce chart hover layout and sorting work#231
novykh merged 6 commits into
mainfrom
perf/surgical-dashboard-hot-paths

Conversation

@ktsaou

@ktsaou ktsaou commented Jul 30, 2026

Copy link
Copy Markdown
Member

What changed

This PR removes four measured hot-path amplifiers without changing chart queries, payloads, refresh frequency, rendered values, or synchronized-hover behavior:

  1. Reuse Intl.Collator instances during dimension sorting.
  2. Coalesce synchronized hover broadcasts to one update per animation frame and skip identical positions.
  3. Replace the value font-sizer's linear write/read loop with a bounded binary search.
  4. Cache popover geometry and move it with a frame-coalesced transform.

Each optimization is isolated in its own commit.

Why

A paused-dashboard hover profile showed 30 pointer movements consuming:

  • 2,983 ms of main-thread task time
  • 665 ms of JavaScript
  • 271 ms of layout
  • 103 ms of style recalculation
  • 1,541 layouts and 1,642 style recalculations

A separate 20-movement audit recorded 3,399 DOM mutations, including 911 mutations on latest-value labels. The dominant problem was synchronized update fan-out plus repeated geometry and font-fit measurements.

The dimension-sort microbenchmark also showed that reusing the collator reduced locale-aware sorting of 6,000 tied dimensions from 19.665 ms to 0.504 ms per sort, and grouped ties from 46.909 ms to 1.358 ms per sort.

The font-fit path now needs at most seven layout probes instead of as many as forty. The popover tests verify that subsequent pointer movements perform no geometry reads.

Compatibility

  • Synchronized charts still share the timestamp while resolving their own rows.
  • The latest pointer event wins within each frame.
  • Pending hover work is cancelled on blur and teardown.
  • Popover alignment and edge flipping are preserved.
  • No artificial refresh backoff or global scheduling policy is introduced.

Validation

  • Full Jest suite: 156 suites passed; 1,534 tests passed and 2 skipped.
  • Production build: 488 CommonJS and 488 ES module files compiled.
  • ESLint passes for every changed file.
  • Isolated Storybook check: synchronized charts rendered, hover followed the latest pointer position, viewport-edge flipping worked, and no console errors occurred.

@ktsaou
ktsaou marked this pull request as ready for review July 30, 2026 12:22
Comment thread src/components/helpers/fontSizer.test.js Outdated
@novykh
novykh merged commit 89e3e87 into main Jul 30, 2026
@novykh
novykh deleted the perf/surgical-dashboard-hot-paths branch July 30, 2026 15:39
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.

2 participants