VectoJS Performance

Use this skill when VectoJS feels slow or when designing workloads that may exceed DOM or Canvas 2D limits.

Diagnosis workflow

1. Separate render cost, layout/text cost, application compute, event/hit-test cost, and DOM semantic-sync cost.
2. Reproduce with a fixed workload and record entity count, text length, backend, viewport, DPR, hardware, and browser.
3. Check whether CPU compute dominates before changing renderer backends.
4. Reduce unnecessary work: on-demand rendering, viewport culling, virtualization, prepared text, and dirty-region discipline.
5. Choose GPU paths only for matching workloads: WebGL point batching for large points/rects, WebGPU particles for compute-driven simulations.
6. Verify with the same benchmark after each change.