逛博客时发现了一个好看的字体-霞鹜文楷

下载地址

字体预览

霞鹜文楷的ttf文件都比较大在20MB左右，可以使用在线工具将ttf文件转换为woff2方便网站加载。我这里选择上传到cdn以便加快字体加载速度，因为本人使用的博客主题后台提供了自定义字体的功能，所以只需要填入链接即可，另外也要注意填入的链接要为https，原因和之前关于图床提到的一样，因为网站是https的请求http会无法响应，或者在cdn中设置为强制https应该也可以（我没有尝试过）。

经过使用发现，由于字体文件确实有点大，网站中字体的加载速度来到了1.8~1.9秒。网上查询后发现建议将ttf格式转换为woff2格式。

在线转换工具地址

最后发现字体加载速度确实加快了，但是仍在0.8秒左右，先这样吧，目前也只影响首次进入网站会有一个小停顿，后续如果遇到更佳的方法再进行尝试。

最后的解决方案

结果查找资料发现可以使用fonttools工具对需要使用的ttf文件就行特定文字的提取，我们平时写博客其实常用字就够用了，这里选择常用6500字，下载地址

fonttools的使用python环境就可以完成

安装

pip install fonttools

使用

pyftsubset 拟瘦身的字体文件 --text-file=要保留的常用字文件

例如我的命令

pyftsubset .\LXGWWenKaiLite-Regular.ttf --text-file=.\c6500.txt

就可以得到一个精简后的ttf文件，这个时候再配合转换为woff2文件即可进一步压缩文件大小。

最终实现 11.1 MB-->3.13 MB -->1.43 MB

最终响应速度维持在65ms左右，至此网页修改字体并优化完成。

再次优化，使用预加载实现浏览器先请求该字体文件，避免出现白屏或者闪烁的情况。

进入主题的文件夹打开head.php，在前面添加如下内容即可

<link rel="preload" href="https://image.lihan.site/LXGWWenKaiLite-Regular.subset.woff2" as="font" type="font/woff2" crossorigin="anonymous">