← all techniques

Desynchronized canvas + capped devicePixelRatio

The bracket's client-side canvas render requests a desynchronized 2D context and caps device pixel ratio at 3 (not the raw 3x report some Android/iOS devices give), redrawing only on demand via requestAnimationFrame while a match is live.

Why it matters on this device/browser pairing

Uncapped DPR on some devices requests absurd backing-store sizes for a canvas this size; desynchronized rendering avoids the compositor round-trip most browsers otherwise force on every 2D draw call.

The actual code

const ctx = canvas.getContext('2d', { desynchronized: true });
const dpr = Math.min(window.devicePixelRatio || 1, 3);
// rAF loop runs only while a tracked match.status === 'in_progress'

Where it ships

subagentdata.com