Oliver Joseph Ash

Full-stack web developer

Discoverable library gzip sizes

You’ve heard good things about a library. It has thousands of stars on GitHub. Surely the code is concise and without bugs.

Not so fast—before you pull down any library for use in your project, you should be aware of how big it is.

I’ll show you an easy way to find the size for yourself, and how you can help make this information more discoverable for future developers when they have the same question.

Firstly we need a URL to the compiled file. This can usually be found on a CDN, or buried somewhere in the GitHub repository or in the published npm package. For GitHub, grab the raw URL. For npm packages, use a service such as unpkg.com.

Once you have the URL, you can curl it and pipe the response into gzip-size-cli for a nicely formatted number (or gzip - | wc -c).

yarn global add gzip-size-cli
curl -sL YOUR_URL | gzip-size
# E.g. curl -sL https://unpkg.com/react/dist/react.min.js | gzip-size

Wouldn’t it be nice if this information was discoverable in the README of a GitHub project? Enter badge-size.

Whenever you go through the steps above to find a file size, do your peers a favour and raise a pull request to the source project, adding this badge to the README. Just drop the above URL in:

![gzip size](http://img.badgesize.io/YOUR_URL?compression=gzip)

Example PR: https://github.com/facebook/react/pull/9177