A small CSS rule made the Arcadians arcade work harder than it should

The Arcadians press page has a little arcade playing behind the artwork. Ships weave between stone tablets and fire in time with the song. It has a frame-rate fallback intended to keep that scene manageable on slower screens by reducing the number of moving pieces.

That fallback had a surprisingly small flaw. It marked spare ships as hidden, but the page’s own CSS still told the browser to display them. Another rule, meant to hide extra tablets at the lowest setting, counted the ship images first and hid all the tablets. So the game could look as if it had reset while the browser still painted ships it was meant to remove.

I’ve fixed both rules. In a controlled slowdown of the live page, the lowest setting now showed two ships and six tablets, with none of the hidden pieces still painted. On a fresh normal load, the full group was still there. The collision shapes also sit closer to the visible ships and tablets, with a narrow contact area for bullets, so near misses are less likely to become explosions. Firing is still tied to the song’s 145 BPM pulse.

That fixed the fallback, but not the gradual slowdown I could still see. A second issue was in DanceMoves, the shared timing code behind the press pages. Each time the ships moved, it rescanned the page and added another copy of its generated CSS. In one long-running test that stylesheet grew to more than 1.3 million characters, even though the number of ships and tablets had dropped.

I’ve updated DanceMoves so ordinary movement doesn’t trigger that scan, and a genuine rescan replaces its generated rules instead of piling them up. Version 3.1.7 is now live. In a fresh public Arcadians test, the stylesheet stayed at 885 characters after more than two minutes while all eight ships and 28 tablets remained in play. The release tests and publication workflow passed too.

That is a measured fix for the growing stylesheet, not a guarantee of smooth playback on every device. I still want to check a lower-powered machine for longer. Chips and Ketchup uses the same shared code, but its song-driven visuals still slow down in Brave; that needs its own playback diagnosis rather than assuming this change solved it.