Optimizing fonts

As at the time I write this, the total file size for all the fonts I used on my site was about 3MB. This means on slower networks, it took about 5-6 seconds to load. Meanwhile, you’ll be looking at a completely loaded page with texts appearing blank.

Thanks to this StackOverflow answer, I was able to reduce them down to 200KB. Drastic!

How to

First install fonttools with:

pip3 install fonttools
pip3 install brotli # if you are using .woff/.woff2 formats

Now run the following command to optimize the font:

pyftsubset <font-file-name> --output-file=<font-file-out-name> --unicodes=U+0020-007E

The <font-file-out-name> should not be the same as the input file name.

U+0020-007E is the range sufficient for Basic Latin. In other words, they’re enough if your website is in English. If you want to include other character ranges¹, do something like:

pyftsubset <font-file-name> --output-file=<font-file-out-name> --unicodes=U+0020-007E,U+00A0-00FF