人生苦短,我用 python
主方案我们用 python 的 fonttools 解决问题。
#!/bin/bash
fonttools subset "./src/assets/fonts/font.woff2" --text-file="./subset.txt" --output-file="./src/assets/fonts/subset-font.woff2"
fonttools ttLib.woff2 compress "./src/assets/fonts/subset-font.woff2" -o "./src/assets/fonts/min-subset-font.woff2"
rm -rf ./src/assets/fonts/subset-font.woff2
subset.txt 就是一个常用汉字子集,例子可以看这个 gist。
操作步骤如下:
pip3 install fonttoolspip3 install brotli(压缩功能会用到)genSubset.shsubset.txt 添加该字再重复以上步骤即可如果你还是不想用 python,坚持 Node 的话,以下提供两个方案供参考。
当然,其实把所有常见汉字包进去其实是一种偷懒,但是不能否认这是十分高效的做法。
把字体文件极致压缩到只包含你的网站使用到字也是可能的,甚至在现在还简单一点,因为 SSR 又起来了(如果是 SSG,那就更是简单),以前 SPA CSR 是真的不方便。
这样的极致压缩方案其实早就有了,那就是八年前的“远古”项目字蛛。可惜现在的 Node 应该是不能正常运行了,得故意为压缩字体 nvm 一下。
其实用 py 主方案的时候我就觉得,这样的操作在 Node 应该也有替代方案,今天找了找,大概 fontkit 也是可行的。(没有实际使用过,仅提供信息)
在线生成字体子集,原理还是跟主方案差不多,不过不用装 python 也不用写代码了,直接给你提供 UI,把子集字符贴进去点一下生成就可以了。虽然是在线工具,但是实际上不会上传你的字体和子集字符,都是纯前端操作,无隐私问题。

使用中文网字计划提供的在线分片工具,子集不满足需求的情况下可以使用。原理是把完整的 CJK 字体拆成 50 到 70 kb 的小文件再按需加载,实际上页面上使用的字体很可能只需要少数包即可完整渲染。但跟上面子集的区别是这是完整字体的拆分,所以这种方法保证了少数情况下生僻字的正常渲染,在 HTTP/2 并行下载的加持下更爽。
而且这个站点是开源的,你也可以直接安装 npm 包用 node 进行字体操作。
人生苦短,我用 python
主方案我们用 python 的 fonttools 解决问题。
#!/bin/bash
fonttools subset "./src/assets/fonts/font.woff2" --text-file="./subset.txt" --output-file="./src/assets/fonts/subset-font.woff2"
fonttools ttLib.woff2 compress "./src/assets/fonts/subset-font.woff2" -o "./src/assets/fonts/min-subset-font.woff2"
rm -rf ./src/assets/fonts/subset-font.woff2
subset.txt 就是一个常用汉字子集,例子可以看这个 gist。
操作步骤如下:
pip3 install fonttoolspip3 install brotli(压缩功能会用到)genSubset.shsubset.txt 添加该字再重复以上步骤即可如果你还是不想用 python,坚持 Node 的话,以下提供两个方案供参考。
当然,其实把所有常见汉字包进去其实是一种偷懒,但是不能否认这是十分高效的做法。
把字体文件极致压缩到只包含你的网站使用到字也是可能的,甚至在现在还简单一点,因为 SSR 又起来了(如果是 SSG,那就更是简单),以前 SPA CSR 是真的不方便。
这样的极致压缩方案其实早就有了,那就是八年前的“远古”项目字蛛。可惜现在的 Node 应该是不能正常运行了,得故意为压缩字体 nvm 一下。
其实用 py 主方案的时候我就觉得,这样的操作在 Node 应该也有替代方案,今天找了找,大概 fontkit 也是可行的。(没有实际使用过,仅提供信息)
在线生成字体子集,原理还是跟主方案差不多,不过不用装 python 也不用写代码了,直接给你提供 UI,把子集字符贴进去点一下生成就可以了。虽然是在线工具,但是实际上不会上传你的字体和子集字符,都是纯前端操作,无隐私问题。

使用中文网字计划提供的在线分片工具,子集不满足需求的情况下可以使用。原理是把完整的 CJK 字体拆成 50 到 70 kb 的小文件再按需加载,实际上页面上使用的字体很可能只需要少数包即可完整渲染。但跟上面子集的区别是这是完整字体的拆分,所以这种方法保证了少数情况下生僻字的正常渲染,在 HTTP/2 并行下载的加持下更爽。
而且这个站点是开源的,你也可以直接安装 npm 包用 node 进行字体操作。