Want to here what a website sounds like as it loads? This tiny piece of code will let you! 📦

1    16 Feb 2020 01:20 by u/yc_boi

EDIT: *hear I recently saw this on Hacker News. Just enter this code into the console (inspect element and then paste into the console) and you'll hear the noises based on the site's DOM changes. /* Copy this into the console of any web page that is interactive and doesn't do hard reloads. You will hear your DOM changes as different pitches of audio. I have found this interesting for debugging, but also fun to hear web pages render like UIs do in movies. */ const audioCtx = new (window.AudioContext || window.webkitAudioContext)() const observer = new MutationObserver(function(mutationsList) { const oscillator = audioCtx.createOscillator() oscillator.connect(audioCtx.destination) oscillator.type = "sine" oscillator.frequency.setValueAtTime( Math.log(mutationsList.length + 5) * 880, audioCtx.currentTime, ) oscillator.start() oscillator.stop(audioCtx.currentTime + 0.01) }) observer.observe(document, { attributes: true, childList: true, subtree: true, characterData: true, })

2 comments

1
s/here/hear/
1
whoops