beat lab / spectrum
AUDIO-REACTIVE

See the
signal.

The same ring buffer that drives the signal page now feeds an AnalyserNode. FFT decomposes the oscillator output into frequency bins. Canvas draws what the ear hears.

Mouse X controls frequency. The spectrum responds in real time. Bars rise from the bottom. Waveform floats above. Particles burst on peaks. One signal, visualized.

SIGNAL PATH
mouse X
ring buffer
AudioWorklet
AnalyserNode
FFT
Canvas
ANALYSER NODE

Sits between the AudioWorklet and the speakers. Performs FFT on every audio frame — decomposing the waveform into 128 frequency bins. getByteFrequencyData() returns magnitude in dB. getByteTimeDomainData() returns the raw waveform. Both feed the canvas every frame.

SAME WORKLET, NEW LENS

The signal-processor.js AudioWorklet is identical to the one on the signal page. Same SPSC ring buffer. Same frequency input. Same sine oscillator output. The only addition is the AnalyserNode between worklet and destination. Different view. Same instrument.