HTML5 Experiment – Reversi

Having read about HTML5 for so long, I decided to finally take the plunge and do a little experimenting.  The result, a canvas-based Reversi game.


  • Canvas based Reversi board with animated moves.
  • Worker based AI that can be interrupted to change the difficulty or disable. (Warning: Anything above easy was incredibly time and CPU intensive on my 4 year old computer.  It may be better with new computers.)
  • Goofy iPhone style interface, since the next step would be to turn this into an iPhone app.
  • Warning: Only tested with Chrome.  No clue how it will react to other HTML5 compatible browsers.


The canvas interface is pretty easy to work with and reminded me a lot of working with the Cairo graphics library.  It took less than a day to get the actual game up and running, a couple days to get the worker AI running, a few more days rewriting the JavaScript using proper class structures and inheritance, and a few days just messing around with the CSS.  The development tools available in Chrome were invaluable, making it a cinch to debug code, track down performance problems, and quickly identify what CSS was being used by other sites.



Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s