Last week we have published a post on how fast is the HTML5 canvas. The test was using a simple particle generator that followed the device's accelerometer. As promised we are working on the benchmark to improve it and add more functionality. In addition to improving the functionality of the benchmark application, we plan to run our test on more devices and using more configurations.
The major difference between the two benchmark applications (in the two blog posts) is that the new app is more deterministic and complex (as far as the rendering is concerned). As usual you can get the code from MoSyncLab's Github page and try it out yourself. Here are screenshots of the app running on iPhone 4s:
We ran our tests on a bunch of devices (we had a couple more than the previous time) for several times and recorded the performance in Frames per Second(fps). The results follow the same pattern as before. You can see the list of devices and their respective performance results (average over all tests) below:
and here is the chart that visualizes the performance of HTML5 canvas and OpenGL, on different platforms:
There are some interesting points in our test results. First, Apple is clearly using some sort of hardware acceleration in iOS 5 for HTML5 canvas. Next, there is a steady performance increase in HTML5 canvas from Android 2.1 to Android 3.0, but there is a strange performance drop in Ice Cream Sandwich (which might be because of the hardware as well).
So in summary, we are still better off using OpenGL for mobile games until the majority of users move to newer operating systems and devices.