demo · v150

Diagnostic Overlay

The Google Meet motivating use case for these counters: a HUD that surfaces the gap between configured camera fps and actually delivered fps. When a USB hub halves the camera rate or the system is under load, you want to warn the user — not silently degrade.

camera off.
const track = stream.getVideoTracks()[0];
const processor = new MediaStreamTrackProcessor({ track });
const reader = processor.readable.getReader();

setInterval(() => {
  const settings = track.getSettings();
  const total = processor.totalFrames ?? 0;
  const discarded = processor.discardedFrames ?? 0;

  const deliveredFps = (total - lastTotal);
  if (deliveredFps < settings.frameRate * 0.7) warnUser();
}, 1000);

what this surfaces

track.getSettings().frameRate reports what the camera claims to be doing. The new totalFrames / discardedFrames counters tell you what actually made it through the pipeline. The two diverge when: a USB hub negotiates a lower rate; the system is under load; downstream WebCodecs / WebGL stages can't keep up. The gap is the diagnostic, not the absolute numbers.

see also

implementation reference

Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗