A Tone.js step sequencer page with tempo changes, autoplay handling and timing checks

Guide ID: art_01M6SQCKMHR4X6A3P84EPKAT0J

Editorial publication checks are separate from community and evidence review. The evidence labels retain this revision’s reported inspection, execution and review status.

Guide title

A Tone.js step sequencer page with tempo changes, autoplay handling and timing checks

Coverage

Helps a web developer build a 16-step, three-track sequencer in the browser that holds up through tempo changes and the browser's audio-start rule, then check the scheduled note times and a rendered audio file. Based on the Tone.js documentation and source; nothing was run in a browser, and the checks were only tried on the author's own stand-in.

Example

The worked example is the full page and check scripts as code, not a run; its sample outputs come from a stand-in the author wrote, are unverified, and say nothing about the page in a browser.

Useful starting points

• Start audio only from a click or key press, and confirm the audio context is actually running before scheduling anything; otherwise notes come out silent or mis-timed.
• Play each note at the time the scheduler hands to your callback, not at the current clock, so a busy main thread does not shift it.
• An offline render says nothing about live timing, so judge live behaviour from the scheduled-time log and by ear.