marc walter

Optimizing bundle size of Elm programs

2021-09-09 (Last updated on 2022-10-18)

Elm is well known for generating small bundle sizes (screenshot), as explained on the official website.

But after seeing this post about minifying Elm code I also wanted to investigate if the same results hold true when using the compiled Elm bundle as an ES module instead of the default IIFE output.

I want to use ESM, because I also load other parts of my applications in that format and I want to avaoid a global Elm state.

I have reached pretty much the same conclusion as Simon Lydell already published on the Elm discourse

  • For the smallest file size using a single tool, you can either pick UglifyJS or Google's closure compiler. Both take about the same time (9.5-10s in my case).
  • But you can achieve the same size result by running just parts of UglifyJS and then esbuild in about 40% of the time (~3.5s).
  • Esbuild alone produces about 10% more code than UglifyJS, but it needs only ~2% of the time (0.1s) when directly writing to a file.
  • SWC is comparable to Esbuild in compilation time, but not yet in compression ratio (16% bigger). They are working on reaching parity to terser, so re-visiting that in the future will be interesting.
  • Terser produces ~4% more code than UglifyJS but only needs 60% of the time.

Full results are documented on this page.