<body onload="for(r=q='data:audio/wav;base64,UklGRiQAAABXQVZFZm10IBAAAAABAAEA5h0AAOYdAAABAAgA',f=t=0;t++<6e5;q+=f&9)f+='G G UZZUUZUZ5 5 5 5 P P PL G GC5 5(/(@5 '.charCodeAt(t/1441%64)/500;new Audio(r+btoa(q)).play()">JS is jarig \o/
A serious joke ?
This little production is quite interesting technically. It borrows the WAVE PCM setup from the 140b Music SoftSynth and HYPERSONIC MANDELBULB.
The catchy melody originally spans accross 3 patterns of 64 measures, including a "repeat" pattern at a different octave.
All the notes but one, are played on an even measure, and clearly there is no way to store 192 measures into 256 bytes. Exit odd note. Down to 96 measures. Still too much for 256 bytes. Exit repeat pattern. The 2 distinct patterns made it into a 64 bytes long string, and the smae oscillator is reused throughout the whole music.
Instead of using the character codes as MIDI note and compute the exact frequency as:
var note = melody.charCodeAt(t/tempo); var freq = 440*Math.pow(2,note/12); osc += freq;
This would have been sweet because it turned the melody into this string:
var melody = "V V YZZYYZYZQ Q Q Q X X XW V VUQ QLOLTQ "; // LOL!
But this approach leaves no room for visuals or even a title. Looking at the frequency of the notes used, shows that the was a relatively small margin of error by skipping the MIDI encoding and using the raw character codes as increment for the oscillator. This change saved a good 15 bytes!
var melody = "G G UZZUUZUZ5 5 5 5 P P PL G GC5 5(/(@5 "; var note = melody.charCodeAt(t/tempo); var freq = note/500; osc += freq;
Other recent experiments
- MUSIC FOR TINY AIRPORTS 2/1 🛫 Celebrating the 40 years anniversary of Brian Eno's "Ambient 1: Music for Airports" with an homage written in 256 bytes with the Web Audio API.
- THEY COME AT DUSK 👺 A survival horror game for JS1k 2018, where you run away from dead miners as you hear your heart beat. Turn around using the arrow keys until all you hear is beeeeeeeep.
- FRONTFEST MOSCOW It was an honour to be invited to Fronfest Moscow 2017 with the little family to give my first workshop; implementing a Twin-stick shooter using ES6 and Canvas, and to continue my CODE🎙ART series of talks + live coding aiming to inspire new web developer artists.
- MINI DISTRICT How to build a 3D City in 256 bytes with Canvas 2D
- SIERPINSKI GASKET A cute Sierpinski gaskets in 96 bytes of DHTML.
- URYA A sweet text mode 64kb intro on PC, written in PASCAL and showed at the WIRED'96 demoparty where it ranked 4th.
Don't be shy; get in touch by mail, twitter, github, linkedin or pouet if you have any questions, feedback, speaking, workshop or performance opportunity.