SuperSonic - SuperCollider in the Browser

SuperCollider audio goodness baked into your browser

SuperCollider's powerful audio synthesis engine scsynth running in the browser as an AudioWorklet.

Zero installation.

  • AudioWorklet Runs in a dedicated high priority audio thread
  • WebAssembly scsynth's original C++ code compiled for the web
  • OSC API talk to the scsynth server through its native OSC API
Back in the late 90s James McCartney designed a series of live audio programming environments called SuperCollider...

These were systems with both programming languages and audio runtimes carefully designed for live realtime modification at every level — from high sweeping programming language abstractions all the way down to the fine control of the low-level synthesis components of the audio chain.

One of the many gifts from this work is scsynth — the core synthesis engine James created for version 3 of SuperCollider. It was at this point when he formally separated the language from the synth engine.

This split made it possible to combine scsynth's powerful audio synthesis capabilities with any existing — or yet to exist — programming language.

This then led to a suite of powerful new live coding languages using scsynth for audio synthesis.

What if you didn't just bring your language to scsynth? What if you brought scsynth to your environment?

This is SuperSonic. All the synthesis power of scsynth — modified and augmented to run in your web browser.

Code Examples

Drop pro-grade audio synthesis into your web page…

Import from CDN (or self-host)
import { SuperSonic } from 'https://unpkg.com/supersonic-scsynth';
Initialise — zero config needed
const sonic = new SuperSonic();
await sonic.init();
Load and play a synth
await sonic.loadSynthDef('sonic-pi-prophet');
sonic.send('/s_new', 'sonic-pi-prophet',
             -1, 0, 0, 'note', 60);
Load and play a sample
sonic.loadSynthDef('sonic-pi-basic_stereo_player');
sonic.loadSample(0, 'bd_haus.flac');
await sonic.sync();
sonic.send('/s_new', 'sonic-pi-basic_stereo_player',
             -1, 0, 0, 'buf', 0);

Works directly from CDN — no server setup needed. See README

This is a simple playful demo of SuperSonic's audio engine - have fun making noise!

Loading...
Click/Tap & Drag
X: 0.00
Reverb: 0.30
Y: 0.00
Cutoff: 130
Messages
sent0 / 0 B
received0 / 0 B
direct0
dropped0
PreScheduler
pending0 / 0
sent0
scheduled0
cancelled0
Scheduler
queue0 / 0
dropped0
clock drift0ms
Processing
processed0
dropped0
seq gaps0
ticks0
Retries
ok / fail0 / 0
queue0 / 0
retried0
dispatches0
Ring Buffers
in
0%
out
0%
dbg
0%
Engine
audio-
synthdefs0
debug0 / 0 B
Buffers
used0 B
free0 B
allocs0