Artwork courtesy of Anzor Bashkhaz.
One of the most common hurdles that HTML5 developers have to overcome in mobile is the HTML5 Audio implementation. While many platforms support multiple channels, there are often concerns over the latency of playback or the ability to mix multiple sounds simultaneously.
The standard solution to this problem is Web Audio API; though what we are discussing here is not Web Audio API, it is being focused on by our development teams. In the meantime we’ve made available a BlackBerry 10 port of the Cordova-based PGLowLatencyAudio plug-in. The main benefits include:
- Minimal delay between initiating playback and hearing audio.
- Smooth playback of multiple audio files simultaneously.
- Overcomes channel limits of standard audio implementation.
- Qualcomm devices in general are limited to six (6) audio channels; the current HTML5 Audio implementation uses one channel per loaded Audio object.
- Controlled by system audio volume; not multimedia renderer controls.
- No bulky controls interfering with the user experience.
It is important to note that:
- Currently all audio files must be WAV format.
- This is a plug-in for Cordova-packaged applications and is not usable within a browser;.
- Not all audio functionality is present (record, seek, etc.)
To test the capabilities of his new plug-in, I created (and open-sourced) a Cordova-based audio sequencer. You can take a look at the results here.
Starring Shadab Rashid of Cascades fame.
You can see that the chosen audio kit has six unique audio files being played in quick succession; the other kits have ten unique audio files to play with. You can also modify the rate of playback through the BPM slider which updates the frequency within metronome.js via Web Workers, to minimize any impact the main event thread may have on our timing. If you manage to make a super-sweet Low Latency Sequencer audio sample, let me know!
I also created LLAudio.js which is still a work in progress. The idea of this script is that you can leverage a standard HTML5 Audio approach to sound, and LLAudio.js will act as a bridge to the PGLowLatencyAudio plug-in. With minimal (ideally no) change to your existing HTML5 Audio implementation, you can reap the benefits of low latency audio by combining the plug-in and LLAudio.js in a Cordova-based application.
Initial trials with Rubba Rabbit and Gwendolynn, the two staple Ludus samples, have allowed for low latency audio integration with zero code changes to the audio implementation. If your application uses HTML5 Audio, this is definitely worth looking into.
I’ve also found success in re-packaging Construct 2 HTML5 exports with the BlackBerry 10 and Cordova tools. While requiring small changes to the framework (loading WAV files instead of M4A files and picking HTML5 Audio as the default implementation), the remaining implementation was untouched and I was able to enable low latency audio.
Not all audio implementations can leverage LLAudio.js without adaptation (as was the case of Construct 2), but the plug-in can be integrated into any HTML5 / Cordova-based application. If you do try integrating with the low latency plug-in, feel free to reach out with your progress (or questions) via email, Twitter, or on our BlackBerry Community support forums.
Finally, I want to send a big thank you to:
- Khanh Huynh who implemented the PGLowLatencyAudio plug-in on BlackBerry 10.
- Tomas Pettersson who is behind the sfxr tool used to generate the sounds for the various audio kits in the LowLatencySequencer sample.
Read the article: