JavaScript Synth in 4K


Want to let your browser do some number crunching?

This small JavaScript program will generate and play a two minutes long piece of music.

Small? Yes, it's just 3822 bytes, which is actually less than the size of the HTML document that you're currently reading!

The sound is generated with CD quality (44.1KHz, 16 bits stereo), and the size of the generated tune is 21 megabytes (all done client side, in your browser!). As a little bonus, the demo also has some animated graphics (courtesy of HTML 5 canvas).


Be prepared to wait for the sound generation to complete!

Browser compatibility

This demo requires a browser with support for the <audio> and <canvas> elements (HTML 5). The following browsers have been tested:

BrowserVersionGeneration time*Comments
Opera11.0124 sSweet!
Chromium12.0.733.039 sWorks nicely!
Firefox4.055 sAudio and graphics can be a bit out of sync. No looping.
Firefox3.6.16643 sSlow JavaScript! Choppy sound. No looping.

* Time for the synth to generate the music (lower is obviously better). Measured under Ubuntu 10.04 (64-bit) on an AMD Athlon X2 4850e (2.5 GHz).


Quite frankly, this is a technical demo more than anything else (the music is just a simple composition in the proof-of-concept spirit, and the animated graphics was put there as a replacement for dull HTML text output).

So, here's a quick technical break down of the demo:

...if you have any comments, you can leave them here.