MediaRecorder Video Bitrates
In this article, we look at how modern browsers handle video bitrates when recording using the MediaStream Recording API, and its MediaRecorder object. We've done real-world testing across Chrome, Firefox, and Safari at different resolutions, and we share our findings on browser defaults, codecs, and browser behavior.
Bitrate vs. quality: a visual comparison
To make the impact of bitrate concrete, here are two recordings made in Safari iOS - using a simple MediaRecorder implementation - with the back camera at 4K resolution, but with different bitrates. The difference is most visible in areas with motion. The size of the recordings is also a big differentiator. For example, with the same length, the recording at 2 Mbps is 3,5 MB, while the one at 15 Mbps is 18,4 MB.
two 4k recordings: one at 2Mbps one at 15Mbps
Bitrate control
The MediaStream Recording API lets you set a videoBitsPerSecond value when starting a recording.
The default bitrate in each browser
If you don't pass a videoBitsPerSecond value to the MediaRecorder, each browser will use its own hardcoded default value:
- Chrome: 2.5 Mbps (source code)
- Firefox: 2.5 Mbps (source code)
- Safari: 10 Mbps (source code)
To test these defaults, we measured the video bitrate while recording videos using a 4K OBSBOT Meet 2 webcam on macOS with major browsers, and using the front iPhone 13 PRO camera on iOS, at different resolutions, at 30 FPS. Audio was excluded through the getUserMedia call. Here are the results:
Chrome (WebM, H.264) on macOS
| Resolution | Actual bitrate |
|---|---|
| 480p | 2.70 Mbps |
| 1080p | 2.70 Mbps |
| 2160p | 2.70 Mbps |
Chrome hits almost exactly its 2.5 Mbps default regardless of resolution.
Firefox (WebM, VP8) on macOS
| Resolution | Actual bitrate |
|---|---|
| 480p | 2.50 Mbps |
| 1080p | 2.50 Mbps |
| 2160p | 2.50 Mbps |
Firefox locks to exactly 2.5 Mbps across all resolutions.
Safari (MP4, H.264) on macOS
| Resolution | Actual bitrate |
|---|---|
| 480p | 7.96 Mbps |
| 1080p | 9.23 Mbps |
| 2160p | 9.22 Mbps |
Safari approaches its 10 Mbps default at 1080p and above.
Safari (MP4, H.264) on iOS
| Resolution | Actual bitrate |
|---|---|
| 480p | 5.65 Mbps |
| 1080p | 9.75 Mbps |
| 2160p | 9.54 Mbps |
iOS Safari follows the same pattern, but the bitrate is lower at 480p.
The defaults are enforced. Each browser consistently produces video bitrates close to its defined default, and, importantly, the bitrate doesn't scale with resolution. A 4K recording in Chrome, without specifying a custom bitrate, will hit the 2.5 Mbps ceiling (default bitrate on Chrome) just like a 480p recording.
What happens when you explicitly set videoBitsPerSecond
Current versions of Chrome, Firefox, and Safari all support the optional videoBitsPerSecond property.
Chrome (WebM, H.264) on macOS
| Resolution | Requested | Actual |
|---|---|---|
| 480p | 1.50 Mbps | 1.65 Mbps |
| 1080p | 7.00 Mbps | 7.22 Mbps |
| 2160p | 14.00 Mbps | 14.31 Mbps |
Firefox (WebM, VP8) on macOS
| Resolution | Requested | Actual |
|---|---|---|
| 480p | 1.50 Mbps | 1.45 Mbps |
| 1080p | 7.00 Mbps | 6.66 Mbps |
| 2160p | 14.00 Mbps | 14.08 Mbps |
Safari (MP4, H.264) on macOS
| Resolution | Requested | Actual |
|---|---|---|
| 480p | 1.50 Mbps | 1.34 Mbps |
| 1080p | 7.00 Mbps | 6.17 Mbps |
| 2160p | 14.00 Mbps | 13.05 Mbps |
Safari (MP4, H.264) on iOS
| Resolution | Requested | Actual |
|---|---|---|
| 480p | 1.50 Mbps | 1.57 Mbps |
| 1080p | 7.00 Mbps | 6.75 Mbps |
| 2160p | 14.00 Mbps | 12.24 Mbps |
The videoBitsPerSecond property is respected. Across all browsers and platforms, the actual bitrate stays within roughly 10-15% of what was requested. The spec says videoBitsPerSecond is a hint, and indeed browsers treat it as a target.
What bitrate should you actually use?
Setting a bitrate matters with higher resolutions. It directly affects file size and visual quality. A lower bitrate means smaller files but more compression artifacts, especially at higher resolutions.
For a practical reference point, YouTube's recommended upload bitrates are a reasonable starting point for what "good quality" looks like at each resolution. For 1080p, they suggest 8 Mbps for SDR content at 30 fps, and for 4K, it goes up to 35-45 Mbps for SDR at 30 fps.
Whether the default 2.5 Mbps is good enough depends on what you're recording and at what resolution. At 720p and above, videos recorded at the 2.5 Mbps default bitrate on Chrome and Firefox start showing visible compression artifacts, such as tearing and smearing in areas with motion or fine detail.
A note on codecs
Firefox only supports VP8 in the WebM container. Chrome records to WebM with H.264 by default. Safari records to MP4 with H.264 by default. In some cases, Chrome and Safari support better codecs (our MediaStream Recording API demo lists them all).
The bitrate needed to achieve a given level of picture quality decreases with more efficient codecs and increases with higher fps.
Given the many possible codecs and file types, if you need your recording to play cross-browser, you'll need to transcode it on the server side. Pipe handles this. It takes whatever MediaRecorder produces across browsers and transcodes everything to H.264 and AAC in an MP4 container, so you don't have to deal with that later.
What these results show
- Each browser has a hardcoded default bitrate: 2.5 Mbps for Chrome and Firefox, 10 Mbps for Safari.
- These default values do not scale with resolution. A 4K recording gets the same bitrate as 480p unless you specify otherwise.
- Setting
videoBitsPerSecondworks; browsers respect it within about 10–15%. - Bitrate affects file size and quality significantly. Don't assume the default is good enough for all resolutions.
- For consistent file and codec output across browsers, you need to transcode the recordings server-side.
