New features in Chrome and Firefox for Android

by Ashley | 19th, November 2013

HTML5 games on mobile is particularly important for many developers - and historically a little problematic. Fortunately on Android, which is by quite a margin the most popular mobile platform, there have been some very good developments in browser technology recently. Here's a quick overview of some of the new features in Chrome and Firefox for Android. Download them for Android devices from the Google Play store if you don't have them already - here are the links: Google Chrome for Android and Mozilla Firefox for Android. (In some cases you can install directly to your device from a desktop browser on those pages.)

Note some of these demos require Chrome 31, which only just came out - if any of them don't work, try checking for an update on Google Play. Another way to try out the next versions of Chrome or Firefox for Android is to use the beta apps, which you can find here: Chrome beta for Android and Firefox beta for Android. These are separate apps so can sit side-by-side with the regular browsers in case you want to keep them for day-to-day browsing.

WebGL

Chrome and Firefox for Android both now support WebGL! This enables vastly improved performance as well as Construct 2's awesome shader effects such as this ripple transition example. This alone can make for a much more mobile gaming experience in the browser.

Firefox appears to support WebGL on all devices. However Chrome have taken a stricter approach, and only enable it on relatively new devices. (The technical requirement is for the driver to support the GL_ARB_robustness extension, for security reasons.) This includes the Nexus 4, Nexus 5, Nexus 7, Galaxy S4, HTC One, and other recent devices. As time goes on the proportion of supported devices should increase as today's new devices become tomorrow's older devices. So while it may be limited in scope now, it's promising for the future.

Web Audio API

Both Chrome and Firefox for Android now support the Web Audio API, enabling reliable low-latency polyphonic audio playback. On top of that you get to play with some advanced effects in the Audio object like convolution and filters that can add a new level of immersion to your games. Try playing with this sound board to try them out!

Microphone input

Chrome 31 now supports audio input with a microphone, if present. This could make for some pretty novel ways to control games! The desktop version has supported this for a while, but it's now arrived in Chrome for Android as well. You can use the User Media object in Construct 2 to get microphone input and route it to an audio tag (where you can add an analyser). Try out microphone input here.

Add to home screen

Chrome 31 for Android was going to support an 'Add to home screen' option in the browser menu, but it's been postponed to Chrome 32. Like on iOS, this adds the page as an icon on the home screen, as if it were an app. When launching from the home screen the browser UI is hidden, and you get a true fullscreen experience, just like a native app again. Construct 2's offline support also means games added to the home screen continue to run even when offline. This helps blur the line between apps and the web, and might be a good way to encourage players to keep coming back to your game.

Fullscreen API

Rather than using unreliable hacks to hide the browser address bar, Chrome and Firefox on Android support the Fullscreen API. In Construct 2, this means you can use the Browser object's Request Fullscreen action to switch in to fullscreen mode. Like with the desktop browsers, this gets you a full-display experience from the web page itself, without needing to add to the home screen or compile as a native app.

Vibrating the device

Firefox for Android supports vibrating the device using the Browser object's Vibrate action. Chrome does not support this just yet, but the next version (Chrome 32) should. This allows a simple kind of haptic feedback for games. Try it out in Firefox for Android with this simple demo.

Speech recognition and synthesis

Speech recognition is already supported in desktop Chrome, and has arrived to Chrome for Android 31. Try out this speech recognition demo, made using Construct 2's User Media object. Speech synthesis (also known as "text to speech") should also be supported soon in both the desktop and mobile versions of Chrome - we'll add support to the User Media object when that happens.

What about iOS?

Sadly, iOS 7 did not bring a great deal of new features for HTML5 games. It does however already support the Web Audio API, so it has powerful audio capabilities which you can try out on iOS. It also pioneered the 'Add to home screen' feature, which it has supported for a long time now. We're hoping that iOS 8 will bring WebGL support. With even Microsoft supporting it Apple are one of the last holdouts on this.

Conclusion

For a long time the mobile browser situation has been difficult. The Android stock browser is not great for HTML5 games, but it is gradually being replaced by the excellent Chrome for Android as the default Android browser, which is great news. You can see Chrome's adoption picking up on StatCounter's global stats. Firefox for Android is also a powerful and capable browser which provides a good alternative to Chrome. iOS has long supported some forwards-thinking features like adding to home screen and the Web Audio API, which makes us hopeful they'll catch up with WebGL support soon. Most other platforms such as Firefox OS and Tizen already ship with good quality browsers that are suitable for gaming, so there is not a problem there. We think this shows the future of HTML5 gaming on mobile is very bright indeed!

Now follow us and share this

Tags:

Comments

4
leeruja 3,212 rep

wow very good!

Tuesday, November 19, 2013 at 1:35:58 PM
4
Koodari 3,762 rep

Nice article! :)

Tuesday, November 19, 2013 at 1:45:14 PM
4
Wastrel 11.5k rep

Very nice write up, Ashley!

Tuesday, November 19, 2013 at 2:17:19 PM
4
Behamut 3,709 rep

Grrrreeeat! I love this tool and people behind it, you are awesome guys! keep going!

Tuesday, November 19, 2013 at 2:22:42 PM
4
Beaverlicious 8,819 rep

Ohhh goooosh! This is just...beaverlicious!!!

Tuesday, November 19, 2013 at 2:26:09 PM
4
sosensible 8,590 rep

speech recognition that awesome!!!!

vibration that's great!!!

full screen nice one ;)

just hope ios will get better :)

Tuesday, November 19, 2013 at 2:33:13 PM
4
farsmile90 9,381 rep

I mean WOW, it's the great new, i hope my game will run well on these brower.

Tuesday, November 19, 2013 at 2:34:17 PM
4
rozpustelnik 2,945 rep

Excellent news! Too bad Apple is still afraid of WebGL...

Tuesday, November 19, 2013 at 2:35:13 PM
4
Bigheti 13.6k rep

Cool news. Configuring the screen size to all devices is annoying!

Tuesday, November 19, 2013 at 2:38:55 PM
4
roberto 9,518 rep

Awesome! Android browsers are really improving a lot!

Tuesday, November 19, 2013 at 2:47:08 PM
3
plinkie 3,909 rep

helpful stuff, nice one guys.

Tuesday, November 19, 2013 at 2:55:47 PM
4
jayderyu 13.2k rep

Except that all tests using Chrome Android(beta or not with WebGL) performance was always limited. Does the current release finally offer good performance? having webgl is no guarantee a good implementation.

Tuesday, November 19, 2013 at 4:02:22 PM
2
trmilu 1,943 rep

useful info, thank you

Tuesday, November 19, 2013 at 4:14:35 PM
2
Ashley 144.0k rep

@jayderyu - Chrome for Android 31 does seem to be faster as well. If it supports WebGL and it's still slow, chances are the GPU is just weak and you'd have to deal with that in a native engine too.

Tuesday, November 19, 2013 at 4:21:03 PM
1
jobel 3,152 rep

awesome! love the sound board..

Tuesday, November 19, 2013 at 4:41:50 PM

Leave a comment

Everyone is welcome to leave their thoughts! Register a new account or login.