谷歌提出新的字体调用方案帮助提高中文字体的加载速度

谷歌提出新的字体调用方案帮助提高中文字体的加载速度

大家好,又见面了,我是全栈君。

谷歌旗下的网页字体调用Google Fonts API旨在帮助用户加载不同网站时复用资源达到提高加速速度的目的。目前该公司提出了新的解决方案用来提高中文字体的加载速度, 该方案主要利用机器学习对字符集进行排序。我们知道拉丁语系的网络字体通常大小只有 100~400KB,其他写作系统的字体大小通常只在200~600KB间。

 

但是中文系列的字体文件则需完整包含 44,683 个字符,这致使整个字体文件的大小介于15MB~20MB 之间。因此中文网站在调用网络字体时会占用服务器带宽资源, 同时用户也需消耗更多的时间去加载网络字体文件。

437dde096013d66.jpg

 

谷歌新的解决方案:

本次谷歌提出的新方案时按照机器学习对中文网页进行扫描,然后再统计哪些字符可能会共同出现在网页上。最终按照机器学习结果将44,683 个字符排列成102个切片,在浏览网页时浏览器会按照顺序加载需要的字体。

谷歌本次切片和测试的字体为 Noto Sans SC 切片版,使用切片版字体进行调用时可以极大地降低延迟时间。而谷歌Google Fonts API本身支持跨网站缓存,因此越多的网站使用切片字体用户加载的时间就会越来越短。本次新增的切片版字体为Noto Sans SC Sliced字体文件,Noto Sans SC版不支持切片但拥有更多字体样式。

切片字体调用说明:

@import url(//fonts.proxy.ustclug.org/earlyaccess/notosansscsliced.css);font-family: ‘Noto Sans SC Sliced’, sans-serif;

目前谷歌字体调用国内解析地址已经为谷歌中国BGP服务器,如果你觉得加载缓慢还可使用中科大反向代理。地址:fonts.gstatic.com—>fonts-gstatic.proxy.ustclug.org  ||  fonts.proxy.ustclug.org—>fonts.proxy.ustclug.org (均支持HTTPS)

更多具体细节请访问:https://fonts.google.com/earlyaccess#Noto+Sans+SC+Sliced

测试计划:

谷歌邀请准备测试和使用切片字体的网站帮助改善切片字体技术,使CJK网页字体的加载速度可以继续提高。如果您的网站准备使用切片字体可以在网站头部附加小型js库向谷歌发送切片字体的加载以及网页加载时间。

该库只收集以下内容:1、下载切片字体的时间;2、下载 Google Fonts CSS 时间;3、网页整体加载时间。如果您愿意帮助谷歌改进中文切片字体技术那么请在网页头部添加以下代码:(未使用切片字体无需添加)

<script src=”//fonts.gstatic.com/ea/timing/v1/mlfont.js” async></script>

 

转载于:https://www.cnblogs.com/fonts/p/7442369.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/108204.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • MySQL导入sql文件的三种方法

    MySQL导入sql文件的三种方法文章目录一、使用工具NavicatforMySQL导入1.打开localhost_3306,选中右击“新建数据库”3.指定数据库名和字符集(可根据sql文件的字符集类型自行选择)3.选中数据库下的表运行SQL文件4.选中路径导入二、使用MySQLWorkbench导入(MySQL的官方工具)1、第一种方法①.新建一个数据库demo(名字任取),点击指示图标(或者File栏里面的OpenSQLScript…)②.选中路径导入SQL文件③.添加指定库名的命令,并点击运行注意:大概在15、16行

    2022年10月2日
    0
  • 9008刷机 小米max2_小米Max2解锁教程_小米Max2一键解锁BL的方法「建议收藏」

    9008刷机 小米max2_小米Max2解锁教程_小米Max2一键解锁BL的方法「建议收藏」下面是咱们的小米Max2手机的解锁教程,也就是解锁BL的教程,在论坛里看到有机友在找相关的解锁操作,所以在这里整理了一下详细的解锁操作步骤供大家参考了,这个解锁是解锁BL,不是手机屏幕解锁,大家不要搞混了,只有解锁了BL之后手机才可以进行相关的root操作或者是刷机操作,如果你还不知道怎么进行解锁的话,就和迷你手机网一起来看看详细的解锁操作过程吧:下面是小米Max2详细的解锁步骤:1:然后到这个网…

    2022年5月29日
    104
  • intellij idea激活码多少钱(最新序列号破解)

    intellij idea激活码多少钱(最新序列号破解),https://javaforall.net/100143.html。详细ieda激活码不妨到全栈程序员必看教程网一起来了解一下吧!

    2022年3月19日
    50
  • 数字图像处理均值滤波matlab函数_均值滤波怎么计算

    数字图像处理均值滤波matlab函数_均值滤波怎么计算图像的平滑、锐化都是利用掩模操作来完成的。通过掩模操作实现一种邻域运算,待处理像素点的结果由邻域的图像像素以及相应的与邻域有相同维数的子图像得到。这些子图像被称为滤波器、掩模、核、模板或窗口;掩模运算的数学含义是卷积(或互相关)运算;掩模子图像中的值是系数值,而不是灰度值;……

    2022年10月26日
    0
  • 中国移动apn接入点选哪个网速快(中国移动数据接入点怎么设置)

    中国移动有cmwap,cmnet和LTE三种网络接入点。这三个网络接入点的特点各有不同。其中LTE就是指4G,网络速度相较其他两种接入点速度更快,流量损耗速度也更快。具体介绍如下:1、CMNET可以获得完全的Internet访问权。我们通过CMWAP只能访问WAP网站。CMWAP使用HTTP代理协议和WAP网关协议可以访问到Internet。CMNET则适用于所有协议,它也是标准的TCP/IP协议…

    2022年4月12日
    505
  • HTML导航栏的四种制作方法,jQuery+CSS3实现四种应用广泛的导航条制作实例详解

    HTML导航栏的四种制作方法,jQuery+CSS3实现四种应用广泛的导航条制作实例详解导航条的使用很广,每个网站都会做出具有自己特色的导航条。最近特地去了解了各种类型的导航条,比如具有高亮显示的导航条,中英文互相切换的导航条,具有弹性动画的导航条,甚至是具有摩擦运动动画的导航条(文字下面有横线)等。每种导航条都有自己的特色,比如高亮显示的导航条看起来比较简单,但是视觉效果还不错,具有动画效果的导航条在视觉上也是有很好的效果。接下来将会一一介绍4种应用比较广的导航条,即:高亮显示的导…

    2022年7月22日
    5

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号