iOS 4.3 Beats Android 3.0 (Honeycomb) in HTML5 Support

Submitted by lalit on March 28, 2011 - 7:53am.

Folks at Sencha ran iPad 2 (iOS 4.3) and Motorola Xoom (Android 3.0) through standard HTML5 tests to find out where the two operating systems stand when it comes to full HTML5 support. Sencha used variety of tests, including Modernizr, Acid3, SunSpider, Sencha Animator demos and Sench Touch Kitchen Sink to test areas like JavaScript performance, HTML5/CSS3 feature support, rendering performance and rendering accuracy.

Acid3: Both the iPad running iOS 4.3 and Xoom running Android 3.0 scored a 100/100 on Acid3 tests, but their were some rendering issues especially with Android 3.0. On iOS (image above), there were a few red squares in the top right and in the bottom right of the test results showing slight error in rendering. However, Xoom (image below) had two noticeable rendering bugs - first, the letters “Acid3” were the wrong color (red in place of black) and were missing the drop shadow. Second, in the top right there’s a small red box showing rendering error.

Modernizr: It is used to test what HTML5 features the given browser is supporting. Modernizr found Safari on iOS 4.3 supported SVG, CSS 2D transforms, CSS 3D transforms, CSS transitions, WebGL and Web Sockets. On the other hand, Android 3.0 supports SVG, Inline SVG and CSS3 3D transformations, but lacks support for WebGL and Web Sockets.

Sencha Animator Demos: It tests the CSS3 support and performance for the browser. Sencha ran six animated demos on iOS 4.3 and they worked perfectly rendering all frames accurately and in full fidelity. When it came to HTML5 Canvas support Safari on iPad 2 worked better than any tablet Sencha has tested. In both tests Canvas Cycle and Canvas Rider (a Canvas game), frame rate was higher than other tablets OSes, the UI controls were responsive and the scene updated quickly. On Android 3.0, CCS3 animated demos rendered, but rendered incorrectly. And when it came to Canvas support Canvas Cycle test worked, but the frame rate wasn’t great and Sencha gave a C to Android for HTML5 Canvas support.

Sencha Touch Kitchen Sink: It tests complete CSS3 support in HTML5 browsers. On iOS 4.3 the animations were snappy, lists scrolled quickly and everything just worked. On Android 3.0, the overall experience was smoother than the Galaxy Tab (Android 2.2), but it wasn’t fantastic experience. According to Sencha, browser on Android 3.0 “still has a long way to go accelerating CSS3 transforms.”

SunSpider: The SunSpider tests are synthetic tests that push the JavaScript engine to its limit. Both the Android 3.0 and iOS 4.3 have new and improved JavaScript engines and the SunSpider test result showed the improved performance. Performance of browsers on both the operating systems was almost similar, with iOS winning 5 out of 9 tests, but the difference was very small.

HTML5 Audio and Video: According to Sencha, the iPad 2 nails it. Audio plays back quickly and lets you pause and resume. Video comes up quickly and streams without issue in the browser page. The iPad 2's media support is solid. On the other hand, Sencha was able to get HTML5 audio to work on Android 3.0, but sometimes that audio played even after the page was closed and they weren’t able to get HTML5 video to work on Xoom.

Overall, Aditya Bansod wrote on Sencha blog “The iPad 2 (iOS 4.3), like the first-gen iPad doesn't disappoint. It's fast, it's accurate and it's impressive. Apple truly delivers a top rate, no compromises HTML5 browser.” As for Android 3.0 browser he wrote “The Xoom browser is not ready for prime-time – even for “HTML4” – and it urgently needs a patch update if Motorola wants the product to succeed.”