AUDIOLAB: A React Three Fiber Audio Visualizer Built Like a Radio

AUDIOLAB takes the audio visualizer, that well-loved demo reel staple, and gives it a tuning knob. Abel Gudino built the whole thing as a radio you can load tracks into and actually mess with, which sounds simple until you remember how few visualizers ever bother making the audio source feel like an instrument. Drop in a track. Hit play. Watch the geometry react.

Under the hood it's React Three Fiber leaning on Three.js for the scene graph, with React itself handling the playback state so the controls don't feel grafted on. That's the trick worth noticing. The FFT data flows into the GPU work, and the UI flows around the same React tree, so the whole thing stays coherent instead of devolving into the usual tangle of imperative audio nodes and declarative components arguing over who owns what.

Worth a click, then a longer click. Bring your own audio, swap between the tracks the radio is offering, and crack open devtools to watch the analyser feed the visuals frame by frame. Abel has been shipping this kind of thing across agencies and personal experiments for years, and his portfolio is the wider rabbit hole if you want to follow the thread.