r-audio: Declarative, reactive and flexible Web Audio graphs in React
summary
r-audio is a React wrapper that maps Web Audio nodes to JSX components, providing supports all non-deprecated nodes and graph combinators (pipeline, split, cycle) so arbitrary directed graphs and live mutations are expressible as component trees. It exposes the internal AudioContext via a callback for creating buffers and AudioWorklets, offers an extensible subgraph class for reusable NPM-sharable modules, and ships demoed examples (gain matrix, delay line) that work. Early measurements show noticeably higher start/stop latency than native calls, so performance needs further profiling.
AI-written summary · about
chapters (14)
- 0:00Introduction to r-audio
- 1:05Web Audio API limitations
- 3:08Inspirations and related projects
- 5:13Goals for r-audio library
- 6:14React integration approach
- 7:00JSX graph composition demo
- 8:23Design challenges faced
- 10:50Handling buffers and analyzers
- 11:34Creating reusable subgraphs
- 12:17Live demo of gain matrix
- 14:54Delay line example
- 15:35Performance evaluation
- 17:01Future improvements
- 17:23Q&A session








