my room for a reference

and yeah, the dopamine hits too

NADH ❌❌
NERD AHH✅✅

Nerdy And Dyslexic Hacker aka pixie

whatchu guys starin at. i ain't the one who's short

bullying is my love language ngl

refined it actually. it's customizable either ways

remembered i had a free will and was experimenting with this last night. it's an audio visualizer purely made with web audio API and raw canvas API for the visuals.

how it works

it has two main files, AudioController.ts and VisualizerEngine.ts. the audio controller relies on web audio API and has a signal path:

AudioBufferSourceNode (Player) --> AnalyserNode (FFT) --> GainNode (Volume) --> AudioContext.destination (Speakers).

it uses getByteFrequencyData to extract the spectrum and getByteTimeDomainData to extract the waveform (oscilloscope data). the engine manually iterates through specific indices of the frequency array to calculate average energy for bass, mids, and treble. this normalized data is used for the visual parameters then.

as i said, the visualizer engine depends on canvas 2D API. it runs on a dedicated requestAnimationFrame loop to make sure a consistent 60fps (or 144fps on high-refresh monitors).

this is like an overview of it. i didn't know the concepts before. it's kinda nice what you can build these days with a limited set of knowledge and curiosity. i can make this a native desktop app and monitor output audio from spotify. it'd be nice to put it on the background while working or smtn