Last summer I wrote some code that would let you control a bass synthesizer by whistling (details). I wrote it in a low-level language so I could minimize latency, but the downside is that it's a bit of a pain to install and try out. After playing around with the Web Audio API yesterday, however, I realized I could make a demo in JavaScript. Here it is: bass-whistle-js.

Currently this only works in Chrome, because Firefox and Safari haven't implemented AudioWorklet yet. It has enough latency to be painful, even though the AudioContext is running with minimum latency settings. I suspect this is Chrome layering several buffers, and comes from optimizing for something other than what I want (cross-platform, simplicity, minimizing dropouts, power consumption). Still, it's neat that this works at all!

Debugging my AudioWorklet port was painful, as browser debugging goes. Devtools doesn't understand the worklet very well, and so several syntax errors in the worklet were reported as syntax errors in the UI thread code (crbug.com/1073300). The devtools "disable cache" setting also doesn't seem to apply to worklet modules (crbug.com/1073297), and they don't even show up in the Network tab (crbug.com/1073295), so I put in a cachebuster during development. I also managed to make the browser unresponsive by logging too much (crbug.com/1073301).