We rewrote our custom visualisation renderers from SVG to be in Canvas

11 hours ago

The new profiler dashboard replaces SVG with Canvas for rendering flame graphs, eliminating the need for DOM nodes per frame and reducing browser workload.
Canvas uses an immediate-mode API, where drawing commands create pixels directly, avoiding style, layout, and garbage collection overhead associated with retained-mode SVG.
Data is handled via columnar Arrow format over Arrow Flight, enabling zero-copy reads and efficient rendering by accessing arrays for frame attributes like x-positions, widths, and depths.
Rendering optimizations include viewport culling to draw only visible frames and precomputed positions, making zooming, scrolling, and resetting interactions feel instant.
Performance improvements show the Canvas renderer is about 3.6× faster in isolated tests, with live interactions like zooming and scrolling becoming 4-5 times quicker, though accessibility and text selection remain trade-offs.

Hasty Briefsbeta