AnalyserNode taps into the audio graph without modifying the signal. It exposes raw FFT frequency data and time-domain waveform data via typed arrays — the foundation for any audio visualiser.
Oscilloscope (time domain)
Time-domain data shows the raw waveform — the signal amplitude at each sample. getByteTimeDomainData() fills a Uint8Array where 128 = silence, 0 = −1, 255 = +1.
220 Hz
2048
Samples shown —
Sample rate —
Window —
Peak —
Spectrum analyser (frequency domain)
The FFT transforms the raw waveform into frequency bins. Each bin represents a narrow band of frequencies and shows how much energy is present there. The result is mapped to a 0–255 scale across a configurable decibel range.
0.80
−90 dB
20 Hz1005001 kHz5 kHz20 kHz
Freq bins —
Bin width —
Peak freq —
Peak level —
How it works
The analyser taps into the audio signal without modifying it — like probing a wire with an oscilloscope. It captures a rolling window of audio samples and applies a window function (a fade-in/out curve) to reduce spectral leakage before the FFT runs.
FFT size is always a power of two. A larger FFT gives better frequency resolution but poorer time resolution — you're averaging over a longer window. At 44,100 samples/sec, an FFT of 2048 covers ≈ 46 ms and produces 1024 frequency bins, each ≈ 21.5 Hz wide.
Smoothing blends each new FFT frame with the previous one. At high smoothing the spectrum reacts slowly and looks fluid; at zero every frame is independent — useful for measuring transient peaks. Values around 0.7–0.85 work well for music visualisers.
Logarithmic frequency axis. Displaying bins on a linear scale would cram all musical information into the left 10% of the display — a piano's entire 7 octaves span 27–4000 Hz while 20 kHz sits far to the right. A log scale spreads octaves evenly, matching how we hear pitch.