About this project
Waveform Playlist is a multitrack audio editor and player for the browser, built on React, Tone.js and the Web Audio API. It renders waveforms on canvas and supports drag-and-drop clip editing, making it a web-based alternative to desktop editors such as Audacity.
Core capabilities described in the README:
- Multi-track editing: several clips per track, with drag-to-move and trim handles.
- Waveform visualization: canvas rendering with zoom controls, plus optional pre-computed peaks for faster loading.
- Effects: a library of Tone.js effects (reverb, delay, filters, distortion and others) with real-time parameter control and a master effects chain.
- Recording: AudioWorklet-based capture with live waveform preview, VU metering, overdub and punch-in replace in the Web Components variant.
- Export: WAV export of individual tracks or the full mix, with progress reporting.
- Annotations: time-synced text annotations with keyboard navigation and drag editing.
- MIDI: MIDI file parsing, piano-roll visualization and SoundFont or PolySynth playback.
- Theming: customizable themes with dark and light mode.
- TypeScript: type definitions included.
Usage is component-based. A typical setup wraps the UI in WaveformPlaylistProvider, supplies tracks created via createTrack and createClipFromSeconds, and composes PlayButton, PauseButton, StopButton and Waveform. Hooks cover loading audio (useAudioTracks), transport control (usePlaylistControls), playback animation, zoom, dynamic effects and WAV export. Tone.js and @dnd-kit/react are peer dependencies installed separately.
The project is organized as a set of packages: browser components and hooks, core types and utilities, a framework-agnostic timeline engine, styled UI components, a Tone.js playout engine, and peak extraction. Optional packages add MIDI, annotations, recording, shared AudioWorklet processors, spectrogram rendering and an HTMLMediaElement-based playout with pitch-preserving playback rate.
An experimental Web Components layer (Lit-based, no React required) offers declarative daw-track and daw-clip elements, an imperative editor API, adapter choice between native Web Audio and Tone.js, clip move/trim/split with collision detection, undo/redo, keyboard shortcuts, file drop, metronome with mixed meters and tempo changes, tempo automation, and WAM 2.0 plugin hosting with optional in-browser Faust DSP compilation. A spec document describes the element catalogue and migration phases.
Documentation includes live interactive examples, getting-started guides and an API reference. Browser support requires a modern Web Audio API implementation (Chrome, Firefox, Safari, Edge). The project is MIT licensed and originated in the Airtime project at Sourcefabric.
Comments
0 people shared their preference · Deer Point appears after 10 participants
Sign in to join the discussion.