demo · v146
Glitch counter
A live AudioContext runs a synth while you drive a background CPU load. The page polls audioContext.playbackState + the playback-statistics object every second and graphs the glitch count, the cumulative drop-out time, and the running render-capacity quota. When you turn the load up far enough you can watch the audio break and the API confirm what just happened.
Behind a flag: the playback statistics methods on
AudioContext
ship behind chrome://flags/#enable-experimental-web-platform-features. The page
falls back to baseLatency and outputLatency when the new API isn't there.
Push the load slider to the right to simulate heavy main-thread work. The graph tracks per-second deltas; the meters show running totals.
0glitch events
0 msdropped audio
100%render capacity
—output latency
render capacity %
dropouts / s
const stats = audioContext.getPlaybackStats();
// shape (proposal):
// { renderCapacity: 0.91, totalFramesProduced: …, totalFramesUnderrun: …,
// underrunEvents: … }
const c = (stats.totalFramesProduced - stats.totalFramesUnderrun)
/ stats.totalFramesProduced;
audioContext.addEventListener("statschange", (e) => { /* react */ });