WebChucK

site | docs | npm

WebChucK is ChucK running on the web! Recent advancements have enabled ChucK to run in any web browser with near native performance. Run ChucK on the web, on a tablet, or on your mobile device; take it wherever you go! Additionally WebChucK enables access to computer music programming, opening the door for new users and creative workflows. Using WebAssembly (WASM) and the Web Audio API, you can use WebChucK to build new online audiovisual experiences and web apps.

See WebChucK in action, WebChucK IDE!

Usage

Via npm:

npm install webchuck
import { Chuck } from 'webchuck'
        const theChuck = await Chuck.init([]);
        
        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 (chuck.context.state === "suspended") {
          chuck.context.resume();
        }

You can also embed the WebChucK JS module into your index.html

<button id="webchuck">Start WebChucK</button>
        <button id="start">Play</button>
            
        <script type="text/javascript">
            var thechuck; 
            
            // Import the WebChucK Package and connect the Audio Worklet, start the VM
            document.getElementById('webchuck').addEventListener('click', () => {
                import('https://cdn.jsdelivr.net/npm/webchuck@1.1.0/+esm').then(async (module) => {
                    const Chuck = module.Chuck; // Chuck class
                    thechuck = await Chuck.init([]); // Create a ChucK object
                });
            });
            
            // Button to 
            document.getElementById('start').addEventListener('click', () => {
                thechuck.runCode(" SinOsc osc => dac; 440 => osc.freq; 1::second => now; ");
            });
        </script>

Documentation

WebChucK Documentation here