类别:Develop / 日期:2020-04-02 / 浏览:792 / 评论:0

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

确保在网页字体加载期间都保持可见状态 webfont css js swap google pagespeed 第1张

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

确保在网页字体加载期间都保持可见状态 webfont css js swap google pagespeed 第2张

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

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

确保在网页字体加载期间都保持可见状态 webfont css js swap google pagespeed 第3张

 可能感兴趣的文章

伤心叹戈

评论区

发表评论 / 取消回复

必填

选填

选填

◎欢迎讨论,请在这里发表您的看法及观点。