PhoenixBakery - better compression for your Phoenix assets

Your Libraries & OS Mentoring Libraries
, , , ,
1

PhoenixBakery is library for Phoenix 1.6 (and later) that provides modules implementing Phoenix.Digester.Compressor. There are currently 3 modules:

  • PhoenixBakery.Gzip that replaces default Phoenix.Digester.Gzip with stronger compression at cost of run time and memory usage. But as it is one-time action (for each release) it is IMHO better to use that build time for less transfer used later
  • PhoenixBakery.Brotli that provides support for Brotli algorithm designed by Google and currently supported in all modern browsers. It provides better compression that gzip and moderate decompression speed.
  • PhoenixBakery.Zstd that provides support for Zstandard algorithm designed by Facebook. While it is not supported by any browser (AFAIK), the support may rollout in near future. It provides slightly worse compression ratio than Brotli, but provides better decompression times.
30 Likes
2

Version 0.1.1 released and 0.1.0 was yanked as I spotted bug where PhoenixBakery.Gzip was producing no output due to fact that I forgot to correct output type. Added tests for that as well as set GitHub Actions for CI.

Oh, and also required Elixir version was lowered to 1.11 (due to fact that I use :tmp_dir in tests, and that prevents me from using 1.10 or earlier.

5 Likes
3

I’d love to see some charts showing the compression difference, if its substantial i think a lot of people would use this.

Thanks for making and sharing it!!

3 Likes
4

Sure, will make them (or just steal them from someone else who made such comparison ;))

5

Added new section to the README:

Compression gains

Test files are composed out of Phoenix JS 1.6.2 library and Phoenix LiveView JS 0.16.4 bundled with ESBuild 0.12.17 installed from NPM repository, bundled using command

esbuild ./js/app.js --minify --target=es2020 --bundle --outdir=../priv/static/js --color=true

First we will declare our baseline. These are “regular” bundle and minified bundle and the same files compressed with default Phoenix.Digest.Gzip compressor shipped with Phoenix:

155311	phoenix_app.js
77351	phoenix_app.min.js
34341	phoenix_app.js.gz
24393	phoenix_app.min.js.gz

These are results produced by the compressors available in this package:

34033	phoenix_app.js.gz
30323	phoenix_app.js.zst
29017	phoenix_app.js.br
24339	phoenix_app.min.js.gz
23202	phoenix_app.min.js.zst
21843	phoenix_app.min.js.br

This show us that with this input file we gain only a little bit better results for GZIP compression (<1% for non-minified and <0.5% for minified), but quite substantial for different compression methods, namely:

  • ~12% for ZSTD on non-minified file and ~5% on minified JS file
  • ~15.5% for Brotli on non-minified file and ~10.5% on minified JS file

When compared with default compression from Phoenix.

ZSTD while it provides slightly worse compression ratio it provides better decompression times, which may be preferred on slower or low powered devices.

12 Likes
6

Released 0.1.2

Mostly fixes related to the CI, documentation and compatibility with newer Phoenix releases.

4 Likes