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

    针对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张

 可能感兴趣的文章

伤心叹戈

评论区

共有 1 条评论

user 访客 / 2022-06-06 20:31:33 / Windows 10 x64 / Google Chrome 102.0.0.0 / 回复

发表评论 / 取消回复

必填

选填

选填

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

近期评论