60fps optimizations & RGB color hierarchy


From the beginning of this project, I set myself the following goals:

  •  Constant 60 FPS at all times during the game
  •  No sprite flickering

Of course, you could say that some slowdown and a few flickering sprites from time to time are acceptable, especially on Game Boy.

Many games from that era or today still have one or the other and IT IS perfectly acceptable.

I challenged myself to have neither.

- How to avoid flickering sprites:

This one's easy; you have to avoid having 11 sprites or more on the same line.
Here we have 10 sprites on the red outlined row. One more and the last sprite on this row will be flashing.

Note: the glasses are on a separate sprite to increase the number of colors

- Why I chose to incorporate a color hierarchy to pop a bubble

In this game, you must follow a specific order to pop the bubbles.
Blue bubbles first, then red, then green, and finally yellow and boss bubbles.
This choice is a trick to avoid having too many bubbles on the screen.
Indeed, if you have two bubbles, one red and one blue, if each of them splits, you'll have four to manage on the screen.
Whereas, if you can only pop the red one if there are no more blue ones, then you'll only have two red bubbles to manage.
Ultimately, this adds an interesting element to the gameplay.

- How to avoid slowdowns:

This is more complicated; you have to ensure that all the following operations fit between two frames:

  • sprite movement
  • collision management
  • input management
  • SCY/X viewport movement
  • music management
  • ...

There's no miracle, you have to optimize your code, but here are some tips I used for this game:
- at each frame, I build an array of elements visible on the screen; the others are excluded.
So, I only apply collision management and physics to the elements in this array.
- Updating HUD elements consumes a lot of cycles, so I only display them on odd frames.
And I perform other calculations on even frames.
- The physics of this game requires a lot of mathematical trigonimetry calculations. All these calculations are done in advance and stored in tables in memory. So, instead of performing a CPU-intensive calculation, we will simply look up its result in memory, which represents the biggest optimization for performance gain.

In this video, you can see at any time the number of sprites displayed as well as the CPU load in the top right corner.

Get Yap and the Enchanted Bubbles

Download NowName your own price

Leave a comment

Log in with itch.io to leave a comment.