Canvas architecture & the game loop
June 10, 2025 • 7–8 min read
Input capture first
We sample input at the start of the frame to reduce perceived latency. That single change made flaps feel crisp at both 60fps and variable refresh.
Timing
Aviar uses rAF with a clamped delta and a simple accumulator where needed (e.g., physics stepping during spikes). We keep allocations off the hot path to avoid GC hiccups during bosses.
Collision
Instead of an overkill quadtree, a compact spatial grid partitions hazards/projectiles. It’s cache-friendly and predictable, which matters more than theoretical best-case in this genre.
Draw order
Background → hazards → player → FX → UI. Particles batch by layer to minimize state changes. Nothing fancy; just consistent.