Web Audio clock demo

This is a little demo web app that uses the Web Audio clock to correctly control the timing of audio playback. I'm contemplating the idea of implementing a web based drum machine and this is background research.

The app starts by fetching a JSON manifest file (from S3). The manifest tells the app where to download a big list of drum samples from. This initialisation is hidden behind a loading screen. The manifest fetch request explicitly busts client side caching, while the sample fetch requests force client side caching.

The running app looks like a Windows 98 pop up dialog and when you click the button, it plays a short string of random TB-808 samples, equally spaced with perfect time.

The importance of the audio clock is that it allows you to schedule the playback of audio for some time in the future exactly while using setInterval or setTimeout simply isn't accurate enough to do audio playback for something like a drum machine.

http://static.spacekitcat.com/wbdm3/webapp/index.html

spacekitcat/wbdm-proto-3
Little experiment with the Web Audio clock. Contribute to spacekitcat/wbdm-proto-3 development by creating an account on GitHub.
Source code

Show Comments