DEV Community

Adam
Adam

Posted on • Edited on

Stop Wasting Storage! The Truth About Video FPS, Bitrate & File Size

When streaming video to multiple clients simultaneously, understanding the relationship between FPS, bitrate, and file size becomes crucial. Here's what I learned while optimizing a video streaming system.

The Target: 3-5 Mbps at 24fps

Our goal was to ensure smooth playback for multiple concurrent streams. Why these numbers?

  • 24fps is the film standard and provides smooth motion
  • 3-5 Mbps delivers excellent quality at this frame rate
  • Lower bitrates enable more concurrent streams
  • Higher isn't always better!

The Math Behind Video Streaming

The relationship is straightforward but often misunderstood:

  1. File size ≈ (bitrate × duration)
  2. Higher FPS requires proportionally more bandwidth
    • 60fps needs 2.5x more data than 24fps
    • 30fps needs 1.25x more data than 24fps

Real-World Examples

For a 5-minute video:

  • At 24fps, 4 Mbps = ~150MB file
  • At 60fps, same quality needs 10 Mbps = ~375MB file
  • At 30fps, same quality needs 5 Mbps = ~188MB file

Implementation Tips

  1. Measuring Video Quality:

    • Calculate adjusted bitrate based on FPS
    • Consider file size relative to duration
    • Check for unnecessarily high FPS
  2. Browser-Side Analysis:

    • Using requestVideoFrameCallback for FPS detection
    • Getting file size from content-length headers
    • Calculating real-world bitrate
  3. Quality Indicators:

    • Warning thresholds for bitrate
    • Adjusting expectations for FPS
    • Balancing quality vs bandwidth

Lessons Learned

  1. Higher isn't always better
  2. FPS dramatically affects bandwidth needs
  3. Consistent quality matters more than raw numbers
  4. Browser APIs can help analyze video metrics

Conclusion

Understanding these relationships helps build better video streaming systems. It's not about maximum quality, but optimal quality for your use case.

Top comments (1)

Collapse
 
shangmin_xiao_292c53d886b profile image
Shangmin Xiao

Interesting article.

One thing that's easy to miss is that FPS should be chosen based on the content, not just storage.

For example:


  • Movies → 24fps
  • Screen recordings → 30fps
  • Gameplay → 60fps+
  • Slow motion → High FPS capture  Many people upload everything at 60fps because that's what their phone records by default, even though it provides little benefit for certain content while increasing file size.  While building NextBConvert, a browser-based video processing tool, I noticed this is probably one of the most common optimization mistakes users make. Choosing the right FPS before lowering bitrate often gives a better balance between quality and file size.