Vibe Coding: Pink Noise Generator for Tinnitus
Try the pink noise generator
Today I learned about pink noise being a way to counteract and reduce the symptoms of tinnitus (ringing in the ears). I tried it and it worked. It didn’t completely counteract the ringing, but it reduced the volume, intensity, and sharpness of the ringing. I started listening to a 12-hour YouTube pink noise video on my phone, but I didn’t want to use up that much mobile data to stream it long term. I could download an app, but it’s these little, random apps that tend to be the ones you find out are compromised with malware.
I finally broke down and decided to try vibe coding because it should be fairly simple and I could read the code to ensure it wasn’t doing things I didn’t want or expect. I asked Perplexity:
Please write some HTML that uses JavaScript and the Web Audio api to generate non-repeating pink noise.
I copied the result into a text file, changed the extension to .html
and it worked. I’ve had to edit it a bit to make it work inside a blog page (stripped out the doctype, head, and body tags, then minified the JS so I could put the <script>
element all on one line).
I didn’t just blog it to share, but so I could access it even in low bandwidth situations. It’s barely 1.3 kilobytes in length AND once it’s downloaded, it will use a tiny sliver of the compute resources on your machine. My computer (Core I9 Ultra 285K processor) was at 1% CPU usage at idle. When I ran the pink noise generator, still 1%. It’s got a neglible impact on processor use. On my Android phone, it plays easily in the browser, plays when the browser is in the background, and plays when the screen is off.
Here’s the code. Even minimized you can tell it’s not fetching any external resources, executable or otherwise, and not doing anything but what was asked… well, if you know JavaScript you can tell.
Web Pink Noise Generator Code
1 2 3 |
<button id="start">Start Pink Noise</button> <button id="stop">Stop Pink Noise</button> <script>class PinkNoise{constructor(t){this.audioContext=t,this.bufferSize=4096,this.node=this.audioContext.createScriptProcessor(this.bufferSize,1,1),this.b0=this.b1=this.b2=this.b3=this.b4=this.b5=this.b6=0,this.node.onaudioprocess=t=>{let i=t.outputBuffer.getChannelData(0);for(let t=0;t<this.bufferSize;t++){let s=2*Math.random()-1;this.b0=.99886*this.b0+.0555179*s,this.b1=.99332*this.b1+.0750759*s,this.b2=.969*this.b2+.153852*s,this.b3=.8665*this.b3+.3104856*s,this.b4=.55*this.b4+.5329522*s,this.b5=-.7616*this.b5-.016898*s,i[t]=this.b0+this.b1+this.b2+this.b3+this.b4+this.b5+this.b6+.5362*s,i[t]*=.11,this.b6=.115926*s}}}connect(t){this.node.connect(t)}disconnect(){this.node.disconnect()}}let audioCtx,pinkNoise;document.getElementById("start").addEventListener("click",(()=>{audioCtx||(audioCtx=new(window.AudioContext||window.webkitAudioContext)),pinkNoise=new PinkNoise(audioCtx),pinkNoise.connect(audioCtx.destination)})),document.getElementById("stop").addEventListener("click",(()=>{pinkNoise&&(pinkNoise.disconnect(),pinkNoise=null),audioCtx&&(audioCtx.close(),audioCtx=null)}));</script> |
Copy that into your favorite text editor, name it pn.html
, and open it with your browser (doubleclick it, or drag it into a browser, or right click and choose to ‘open with’ your browser). Interesting bit I found out: if you click the start button after it’s started, that will raise the volume/intensity of the sound, but the stop button stops it with one click.