注册
web

关于前端压缩字体的方法


我在编写一个撰写日常的网站,需要用到自定义字体,在网上找到一ttf的字体,发现体积很大,需要进行压缩



如何压缩


目前我们的字体是.ttf字体,其实我们需要把字体转换成.woff字体



WOFF本质上是包含了基于SFNT的字体(如TrueTypeOpenType或其他开放字体格式),且这些字体均经过WOFF的编码工具压缩,以便嵌入网页中。[3]WOFF 1.0使用zlib压缩,[3]文件大小一般比TTF小40%。[11]而WOFF 2.0使用Brotli压缩,文件大小比上一版小30%



CloudConvert在线字体转换


image.png


可以看下实际效果


image.png


20M 转换为 9M 大小,效果还是很明显


image.png


transfonter


这个网站transfonter.org/只接受转换15M以下的字体


image.png


工具压缩


先下载这个工具字体压缩工具下载,这个工具是从Google的代码编译而来,是用Cygwin编译的,Windows下可以使用


解压出来后大概包含以下几个文件


image.png


下载后打开,其中包括woff2_compress.exewoff2_decompress.exe,使用方法很简单使用命令行:


woff2_compress myfont.ttf
woff2_decompress myfont.woff2

实测效果还不错


image.png


作者:vipbic
来源:juejin.cn/post/7436015589527273522

0 个评论

要回复文章请先登录注册