前端优化：网页中文字体压缩与提取

前言

遇到需要自定义字体的需求时就需要向用户索要相关字体，然而从用户那里拿到的字体通常10m左右，假如用户的服务器带宽不够大，那么。。。。

于是参考网页中文字体压缩（woff2）、拆分、去繁体字库，提高加载速度 进行的字体"安排"

字体提取

为了便于以后更方便的提取，于是绝对将其安装在我得腾讯云无忧主机上，这样以后在提取直接上传到服务器即可。

安装pyftsubset

pip3 install fonttools

小康的服务器自带了python3.6环境，因此省略的相关环境的安装。

安装完成后即可通过pyftsubset --help命令查询相关帮助。

为了方便操作这里直接套用了imaegoo整理的unicodes文件(备用地址)

此文件包含的文字范围：简体字，latin的区间和中文标点符号

工具使用方法

pyftsubset 字体文件 --unicodes-file=sc_unicode文件位置

示例：

pyftsubset NotoSansCJKsc-Regular.otf --unicodes-file=sc_unicode.txt

需要字体文件与sc_unicode.txt文件放在相同目录。

字体压缩

字体压缩用到了谷歌的项目woff2，此工具会将你的字体文件压缩成woff2格式的字体文件。

git clone --recursive https://github.com/google/woff2.git
cd woff2
make clean all

需要g++工具，但我的服务器居然自带了，因此相关环境安装过程也可以省略了。

编译安装完成后会在目录下出现三个文件woff2_decompress、woff2_compress、woff2_info，我们需要将woff2_compress文件进行软连接，这样只需要输入woff2_compress即可调用该程序。

ln -s 文件 /bin/
# 例如 ln -s /opt/woff2_compress /bin/

使用

完成上面操作后，以后压缩字体的过程大概就是如下几步：

1. 上传字体

2. 提取简体字

   pyftsubset 字体文件名 --unicodes-file=sc_unicode.txt

3. 压缩字体

   woff2_compress 字体文件名

4. 取出压缩后的字体文件

参考

• 网页中文字体压缩（woff2）、拆分、去繁体字库，提高加载速度