Airbnb Moves from Webpack to Metro, Enjoys Shorter Build Times
Summary
But even after its codebase quadrupled, the company was able to speed UX changes to the front end when it migrated its JavaScript code bundler from Webpack to Metro in 2018. With build performance significantly improved, UI changes appeared 80% faster, as per the Time to Interactive (TTI) metric. For reference, after the codebase quadrupled around 2018, the average page refresh time for a simple one-line code change was anywhere between 30 seconds to two minutes depending on the project size. Airbnb software engineer Rae Liu covered some of the differences between Webpack and Metro and discussed some of the migration challenges in this recent blog post. The out-of-the-box Metro solution produced giant ~ 5MiB bundles per entry point which were taxing on browser resources, network latency, and unable to HTTP cache.