Overview
This stress tester benchmarks the resolveOverlaps coordinate solver and the custom HTML5 Canvas drawing procedures. By generating dense, generation-branching pedigree charts, we identify rendering limits and frame drops during dynamic camera animations.
Idle0%
Controls
Telemetry Logs
No active telemetry feeds. Trigger a test.
Performance Summary
| Nodes | Layout (ms) | Frame (ms) | Avg FPS |
|---|---|---|---|
| 100 | — | — | — |
| 500 | — | — | — |
| 1000 | — | — | — |
| 2000 | — | — | — |
| 5000 | — | — | — |
Interactive Canvas Viewport (800x500 viewport mapped to high-DPR surface)
Understanding Browser Rendering Limits
When testing layout scale and draw speeds, performance decreases due to three factors:
- Overlap Resolution Complexity: The coordinate placement logic (`resolveOverlaps`) is O(G * N_gen²) where G is generations and N_gen is nodes per generation. Beyond 2,000 nodes, style recalculations and ancestor traversals lead to computational scaling delays.
- 2D Context Drawing Instructions: Each individual node triggers multiple state configurations (stroke, shadow, label fonts, quadrant color arcs, text bounds). Drawing 5,000 nodes requires executing over 40,000 drawing commands per frame, taxing browser composite pipelines.
- Garbage Collection (GC) Thrashing: Re-instantiating coordinate arrays, point hashes, and translation parameters every frame creates heap growth that eventually forces GC pauses (visible as sudden framerate stutters).