Orb Ball Devlog 2

Devlog 2, right on schedule. I got quite a bit done this week. Most significantly, I finished a huge performance refactor and the game now reliably runs 60 FPS even on lower end devices in later rounds. Here are more details:

	before	after
Smoothness	925 dropped frames (74%)	0 dropped frames — locked to refresh, 0 long tasks
Actual presentation FPS	31.5	60.1
Main thread busy	99.9% (idle 5 ms / 10.3 s)	43.5% (idle 5.7 s / 10.0 s)
JS self-time	6,738 ms	2,336 ms (−65%)
GC pauses	642 ms · 210 scavenges · 5,139 MB young garbage	90 ms · 41 scavenges · 1,106 MB (−86% pause, −78% garbage)
React renders	5,629	1,582 (−72%)
motion.div re-renders	×1,837	×246 (−87%)
Long tasks (>50 ms)	4 (up to 71 ms)	0
Forced reflow	45.4 ms · 131 forced layouts	16.6 ms · 67 (−63%)

Very satisfying. Whenever starting on performance work, there’s usually a seed of doubt in my mind about whether I’ll actually see real gains. In this case, there were obvious opportunities to optimize. Up until this point I had been ignoring performance completely, and focusing on prototyping the first version of all the systems.

As part of this performance work, I fixed memory leaks and UI refresh rate issues, but there was one obvious opportunity: React Pixi. My entire game renderer is built with React bindings for PixiJS. This was great for code organization and personal familiarity. But React comes with a lot of overhead, and extracting data every frame from the sim and passing it to React to render was inefficient. I rewrote all the components to imperatively update directly from the simulation’s state, skipping React lifecycle and external store syncing entirely. In future projects, I will skip PixiJS React completely and use PixiJS directly.

Normally, debugging performance in web apps involves a lot of staring at a view sort of like this until my eyes bleed:

But after years of suffering, I have finally had enough of flame charts. In order to make performance investigation easier, I built a tool called perftale and you can find it now on GitHub.

Weekly scraps

Here are some scraps from Taos.

Every creature has a leap animation now!

A few more animation sketches.

We’ve started redesigning all the Lords. Taos’s take on the Lich is on the left, compared to my original sketch on the right.

After some playtesting with my brothers, I realized that goal scoring needs to be a lot more cinematic. Sports are about the highlights, and goal score highlights need to be exciting. Before this week, the orb carrier AI kind of cowered in the corner or ran against invisible walls.

I reworked creature AI inside of goals, added a knockback effect upon scoring, and made tackles no longer cancel the goal timer. By the way, ignore the white overlay that shows up when scoring. That’s going to be a beast that emerges from the pool to eat the goal scorer soon.

Here is the screenshot of the week. I’m playing my brother Yarrow here, and I’m about to win with the Lizard lord. At the moment Lizard has a very over-powered ability where his terrain spells cannot be overriden by the opponent. I overwhelmed Yarrow with negative terrain and won on the next round. Next week, I’m going to release full redesigns of every Lord.

I’m getting closer to finishing a draft of the Orb Ball website.

Changes

Balance

• Every creature and evolution has +1 max health, except Queen summons (Drones, Hornets, Guardlings) and Mini Sludges.
• Trapper, one of Archer’s evolutions, is no longer a melee attacker, but is now a short-range attacker that fires quickly. It keeps its net and previous stats.
• Ranged attackers now have half as long an initial delay when picking a target.
• More powerful spells now appear in the shop earlier, instead of being delayed several rounds past when they should unlock.
• A tackle no longer stops a goal that’s already being scored. Losing possession does though.
• You can now unsummon only one creature per round. Unsummons are treated as a new resource type. This prevents players from selling their whole team and hard committing to a different part of the board to essentially get a free goal.
• Terrain (swamp, tall grass, etc.) no longer covers goal pool floors or walls.

Mechanics

• Orb carriers are now able to better avoid threats when pathing around obstacles.
• Orb carriers now dodge inside goals more effectively, and won’t ever stand still.
• Scoring a goal now sets off a shockwave from the pool: every other creature standing in it, on any team, is knocked back from the center, briefly stunned, and takes 1 damage.
• A creature that scores is now consumed by the goal. Scoring is a sacrifice!

Visual / Audio

• The goal pool flashes white the moment a creature starts scoring, then deepens into the scoring team’s color as the timer fills.
• Creatures and scenery are no longer hidden behind goal pool walls.
• Fog now hugs the tiles where it actually weakens ranged attackers, instead of fading out well past its effect area.

Usability / Performance

• Fixed steadily rising memory use during matches and the periodic freeze it caused, from the full-screen visual effects recalculating the whole scene every frame.
• Improved framerate in matches with lots of creatures on the board or on low-end devices.
• Fixed a periodic stutter from creatures that leave growing terrain trails (e.g. swamp).
• The beacon add (+) and remove (−) buttons are now positioned relative to the screen rather than placed in perspective.

Notable bug fixes

• AI opponents now spread their creatures across more of the field instead of bunching units near their spawn and leaving obelisks wherever they first appeared.
• Fixed beacon path nodes ending up outside the field when a creature with a beacon is repositioned. They now snap back inside the board bounds.
• Fixed bug with Orb carriers getting stuck circling inside a goal they can’t score in (e.g. when beaconed through their own defensive pool).
• Fixed bug with creatures occasionally drifting or getting stuck outside the field beside a corner goal.
• Talismans can now be dropped anywhere on a creature’s sprite, instead of only a small zone near its feet.

Interested in trying Orb Ball?

Join the discord – I’ll be organizing test matches.