WebChucK
WebChucK brings ChucK, a strongly-timed audio programming language, to
the web! ChucK's C++ source code has been compiled down to WebAssembly (WASM) and runs via the
AudioWorkletNode
interface of the Web Audio API. With near-native performance, WebChucK runs on
modern desktop browsers as well as tablets and mobile devices! Bring together ChucK's real-time
sound synthesis engine and the interconnectivity of the web to create new experiences and develop
creative workflows. Use WebChucK to build online audiovisual experiences, immersive multi-channel
audio web apps, online musical instruments, simply by embedding WebChucK into any website! To learn
more about WebChucK and what it can do, check out https://chuck.stanford.edu/webchuck/
Try out WebChucK in action through WebChucK IDE!
Usage
Install WebChucK via npm and use it with TypeScript:
npm install webchuck
import { Chuck } from 'webchuck'
// Create the default ChucK object
const theChuck = await Chuck.init([]);
// Run ChucK code
theChuck.runCode(`
SinOsc sin => dac;
440 => sin.freq;
1::second => now;
`);
Note that many browsers do not let audio run without a user interaction (e.g. button press). You can check for a suspended audio context and resume like this:
if (theChuck.context.state === "suspended") {
theChuck.context.resume();
}
You can also embed WebChucK as a JS module into your index.html
. Here's an example below in JavaScript:
<button id="webchuck">Start WebChucK</button>
<button id="start">Play</button>
<script type="text/javascript">
var theChuck;
// Import WebChucK and create a ChucK object
document.getElementById('webchuck').addEventListener('click', () => {
import('https://cdn.jsdelivr.net/npm/webchuck/+esm').then(async (module) => {
const Chuck = module.Chuck; // Chuck class
theChuck = await Chuck.init([]); // Create default ChucK object
});
});
// Button to run ChucK code
document.getElementById('start').addEventListener('click', () => {
theChuck.runCode(" SinOsc osc => dac; 440 => osc.freq; 1::second => now; ");
});
</script>
Documentation
Check out WebChucK's full documentation here