Why Your Video Player Is Bloating Your Bundle (and How to Fix It)

If you've ever cracked open your webpack bundle analyzer and seen a giant chunk labeled video.js, you know the feeling. That sinking realization that your video player alone is heavier than the rest of your app combined. I hit this exact wall two months ago. A client's Lighthouse score was tanking on mobile, and after some digging, the culprit was obvious: video.js v8 was shipping nearly 600KB of minified JavaScript. For a page that sometimes didn't even autoplay video until the user scrolled down. Brutal. The good news? Video.js just dropped a v10 beta that's 88% smaller than its predecessor. Let's dig into why the old version was so bloated, how they fixed it, and how you can migrate without blowing up your existing player setup. The Root Cause: Legacy Architecture Debt Video.js has been around since 2010. That's ancient in JavaScript years. Over time, it accumulated a lot of weight: A custom UI component system that predates modern frameworks A full CSS stylesheet bundled inline Fla