Multiband compressor

Compresses three bands apart. The signal is split at two frequencies into low, mid and high, and each band has its own threshold and ratio. A loud bass does not pump the highs, and a harsh band can be held down without dulling the rest. It is a device: a state, a panel, an engine and tools, each its own file.

Installation

bunnpmpnpmyarn
Copy
pnpm dlx shadcn@latest add @audio-ui/multiband

Controls

Panel

The panel draws the three bands against frequency, with a handle on each split to drag across. The splits have no knob. The two ranges do not overlap (40 to 1000 Hz and 1.2 to 12 kHz), so the splits can never cross. multibandBands(state) is what the panel draws: what each band keeps of the signal, in dB at each frequency.

Copy
import { MultibandPanel } from "@/components/audio-ui/devices/multiband/panel";
import { multibandDevice } from "@/components/audio-ui/devices/multiband/device";

const [state, setState] = useState(() => multibandDevice.defaults());

<MultibandPanel onValueChange={setState} value={state} />;

Engine

Create it, connect it and update it as for any device: see The engine.

Copy
engine.reductions; // { low, mid, high }: dB taken off each band, read per frame

Two biquads in a row make one Linkwitz-Riley filter, whose halves add back to a flat response. The low band also goes through the two halves of the high split, added, so that it is shifted in phase as the other two are and the three add back flat. Each band has its own detector, the one of the compressor's sidechain, with a soft knee of 6 dB.

Measured in Chrome with all ratios at 1, the output is within 0.01 dB of the input from 60 Hz to 9 kHz. With a 100 Hz tone at -6 dB over a 6 kHz tone, a threshold of -30 dB at 8:1 on the low band takes 16.4 dB off the bass and nothing off the highs. The same on the high band takes 10.6 dB off the highs and nothing off the bass.