bundle-vs-unbundle

This project measures whether it's faster to load JavaScript code as many separate small files or as one big combined file. It's a head-to-head performance comparison that helps developers decide how to organize their code delivery.

When you run the project, it creates a test scenario with thousands of tiny JavaScript modules—think of them like individual cards in a deck. One version keeps all the cards separate and loads them individually (the "unbundled" approach). The other version stacks all the cards together into a single file first (the "bundled" approach). The project then serves both versions on a web server and lets you measure which one loads faster in your browser. You visit two different pages side-by-side and see the results for yourself.

The test setup is designed to be realistic. It creates 5,000 small modules stacked in 5 layers, where each layer depends on the ones below it—mimicking how real applications have nested dependencies. The server that delivers these files is configured with HTTP/2, a modern protocol that's specifically designed to handle many simultaneous requests efficiently. This matters because unbundled code relies on making lots of separate requests, while bundling combines everything into fewer requests.

Web developers and framework maintainers would find this useful. If you're building a tool that decides whether to send code bundled or unbundled to users, this project shows you real numbers instead of guesses. It's particularly relevant for modern JavaScript development where bundlers (tools that combine code) have become standard, yet some newer approaches like "unbundling" or "ESM-first" strategies claim to be faster. By running this locally, you can see which approach wins under conditions similar to your own setup.