来到我博客的很多小伙伴都觉得字体很有个性，其实我也是在博友博客那看到的。
然后博客字体来自开源项目：https://github.com/SolidZORO/zpix-pixel-font
其实自定义字体一般建议不要大于 2M，如果太大，光加载完都是问题，哈哈，但是架不住我喜欢。
不过虽然 CDN 可以加快加载速度，但是我一直还是纠结到底要不要去掉自定义字体，虽然字体包也才 965KB，嘻嘻。
昨晚偶然看到知乎上的文章，发现可对字体进行预渲染优化加速，操作如下：
使用@font-face{font-display:swap}模式可减少用户看到文字的等待时间，可以实现打开网页先显示系统字体，然后在零点几秒后变成新的字体。
当你自定义了@font-face，其实并不能触发字体文件的下载，只有等浏览器解析到使用了该字体文件的 DOM 元素才会触发字体文件下载，是否能让浏览器提前加载字体文件呢？答案是通过 preload 方式提前加载字体文件。
在<head>和</head>中间加入如下代码<link rel="preload" href="yourfont.woff2" as="font" type="font/woff2" crossorigin>，将上面字体链接换为自己的即可，这样就起到预加载的作用了。
通过这两个方法，最终可以解决网页字体加载慢的问题，测试了下，确实可以将加载时间控制在 500 毫秒左右，原本在 1 秒多左右，哈哈。
