demo · v136
Resolution Budget Calculator
Pick a bitrate budget (1080p call, 720p archive, 480p screenshare-with-camera) and watch the calculator pick the best logicalSurface + downscaleFactor the capture API will satisfy. Then start a real capture and see the negotiated track settings.
Note: Captured Surface Resolution constraints are behind an experimental flag in Chrome 136. The budget math still runs without capture; capture itself will throw or fall back if the constraint isn't honoured.
recommended track constraints
width (max)—
height (max)—
frameRate (max)—
downscaleFactor—
est. bitrate—
actual track settings (after capture)
width—
height—
frameRate—
downscaleFactor—
logicalSurface—
Idle
the code
const stream = await navigator.mediaDevices.getDisplayMedia({
video: {
width: { max: 1280 },
height: { max: 720 },
frameRate: { max: 30 },
// CapturedSurfaceResolution adds these:
downscaleFactor: { max: 2 }, // never serve more than 2x downsample
},
});
const settings = stream.getVideoTracks()[0].getSettings();
console.log(settings.downscaleFactor, settings.logicalSurface);