HTML5 Canvas Game Development
November 9th, 2016
I just finished developing a 2D Breakout Game using HTML5 Canvas. I added a workflow to it of course for testing in command line purposes, for speeding up the development process, and speeding up the process of making files production ready. One thing I learned first and foremost: HTML5 Canvas games are data-consumption expensive! By removing a few things from the workflow like
postcss-mixins npm plugin, as well as
minifying code, I was able to reduce the
JS heap by over
10mb. However, the
range still ended up being between
16mb and 42mb. Every time the game restarts, the
cleared right beforehand. This is good of course, but the question is: does a user want to consume up to 42mb of his/her mobile data? At home, via some kind of paid internet service where total data consumption does not matter is one thing, but mobile consumption can matter very much on the go when data caps do matter.
Github’s gh-pages, please visit 2D Breakout Game.