I found this interesting because I am going through the pain of getting basic games working acceptably on mobile, our most important platform.
When I began HTML5 game development, I thought it was a nice idea to render game using Canvas, because it?s quite useful on desktop computers. But on a platform like the iPhone 3GS, it turns out to be a bit of a headache. The game performance sucked; images were rendering at less than 5fps. I had to create rendering engines, one after another.
Currently, I rely on the DOM (Document Object Model). It dictates the way in which my applications are constructed of HTML elements and CSS3 selectors, rather than how they?re rendered to a Canvas. The advantage of using the DOM is that the game can be much faster and more responsive, due to hardware acceleration. It?s important to test your game again and again, and I personally think using the DOM is a better choice than Canvas.
Deal with Audio Issues
Embedding sounds within a game is vital. Unfortunately, the biggest issue in developing a cross-platform HTML5 game is sound. Within HTML5 game development, Canvas has good support, Video is constantly improving, but Audio is still pretty patchy. Games can?t play sound and music simultaneously. Taken from this aspect, HTML5 is not necessarily an ideal Flash alternative!
Other audio issues include:
? Different browsers support different sound formats (mp3, wav, ogg etc)
? iPhones and iPads allow only one mp3 sound to be loaded and played at any time
There are a few ways around these issues:
? For the format issue, I duplicate all game sounds in two formats (OGG and MP3), which covers most browsers.
? For the iOS platform, I keep sound and music in the desktop version of the game, and only music in the mobile version.
? As for Android, because it supports Flash audio play, so I use jPlayer to handle automatic HTML5/Flash audio transition.