Synthlet

Guide

How to use Synthlet modules

This guide will show you how to use the Synthlet modules.

Create

To create a module, you need to call the Module function that will return an instance of an AudioWorkletNode.

The create function will take two arguments, the audioContext and an object with optional configuration and initial values of each parameter:

const osc = PolyblepOscillator(audioContext, {
  frequency: 440,
});
 
const env = AdsrEnv(audioContext, {
  attack: 0.1,
  decay: 0.1,
  sustain: 0.5,
  release: 0.1,
});

Connect modules to the audio graph

Since returning nodes are normal AudioWorkletNodes , you can connect them to the audio graph as you would with any other node:

// Connect a module to another
osc.connect(audioContext.destination);
 
// Connect a module to a parameter (modulation)
adsr.connect(osc.frequency);

Parameters

Each module has a set of parameters exposed as AudioParam that you can control using the value property the same way as you would with any other Web Audio API node:

osc.frequency.value = 880;
adsr.attack.value = 10;
adsr.attack.setValueAtTime(0.1, audioContext.currentTime + 5);

Connect parameters on constructor

Unlike WebAudioAPI, Synthlet create functions accepts other modules as parameters. This is useful to connect modules on creation:

const lfo = Lfo(audioContext, { type: LfoType.ExpRampUp });
const amp = createAmpNode(audioContext, { gain: lfo });

The lfo is now connected and modulating the gain of the amp node.

Start and stop

There are no start and stop methods in Synthlet modules, sources are started by default.

No start/stop

Unlike the standard WebAudio API, Synthlet modules starts automatically.

The modules that needs some kind of start/stop (envelopes, sequencers, etc...) the control is managed with parameters too. For example, start and stop methods are normally replaced by a gate parameter that you can control using the setValueAtTime method:

adsr.gate.value = 1; // equivalent to start()
adsr.gate.value = 0; // equivalent to stop()

The advantage is that you can use a module to start/stop other modules. Evertying can be connected.

Connect and disconnect

Synthlet modules isses the same connect and disconnect methods as any other AudioNode:

adsr.connect(osc.frequency);
adsr.disconnect();
adsr.connect(amplitude.gain);

Disconnect is not enough

Audio worklets still running even if you disconnect them from the audio graph. If you want to fully stop them you have to dispose.

Dispose

Dispose is a handy function that funlly disconnects and stop the module:

osc.dispose();

It also disconnects all dependencies:

const trigger = createTriggerNode(audioContext, {});
const adsr = AdsrEnv(audioContext, { trigger });
const osc = PolyblepOscillator(audioContext, { frequency: adsr });
 
...
osc.dispose(); // Disconnects also trigger and adsr

Unlike the connect in standard WebAudio API, dispose can be called more than once (but only the first call will have effect) and once called, the module is not usable anymore.

Installing individual modules

If you want to optimize for bundle size, you can use the individual module packages and register each module individually.

Install:

npm install @synthlet/polyblep-oscillator

And use:

import {
  registerPolyblepOscillator,
  PolyblepOscillator,
} from "@synthlet/polyblep-oscillator";
 
const audioContext = new audioContext();
await registerPolyblepOscillator(audioContext);
const node = PolyblepOscillator(audioContext, { frequency: 440 });

On this page