确保在网页字体加载期间都保持可见状态

类别：FRONTEND / 前端 / 日期：2020-04-02 / 浏览：6603 / 评论：1

    针对Google PageSpeed（谷歌页面加速）服务中出现的在网页字体加载期间都保持可见状态进行解决。

    谷歌这边给出了两个解决方案，一个是针对特定文字加载JS进行处理，这个优点在于能够兼容各大平台的浏览器。如下：

<div class="text">Some text.</div>
<script src="fontfaceobserver.js" type="text/javascript"></script>
</body>

    另外一直则是，直接在CSS样式表中添加font-display: swap;，这个优点在于比较简单，但是兼容性相对较差，如下：