前端 / 小程序——第三方字体库压缩(压缩率80%)

news/2024/7/20 1:44:30 标签: python, javascript, node.js, 前端, 小程序

文章目录

  • 前言
  • 压缩字体
  • 总结


前言

在做微信小程序时,需要使用第三方字体库,但是该字体库有30+MB大小,导致微信使用wx.loadFontFace一直报错。网速很慢的话,极其影响用户体验,小的字体库没有问题,所以是字体库太大导致报错,并且加载也很慢,致使字体无法生效。换字体是不可能的,特此记录一下如何将38MB的字体库压缩成5.28MB的,这种压缩比率,一般的在线压缩或软件是达不到的。


经历一次压缩和转换最终从37MB压缩为5.28MB,已经达到我的需求了
在这里插入图片描述


压缩字体

前置条件:python环境

  1. 借助python环境,安装fonttools插件

没有pip包管理工具先装pip,详细的我就不说了,当然python环境是也必须的

javascript">pip install fonttools

  1. 下载字体编码列表文件,另存为sc_unicode.txt
    下载地址:字体编码(打开直接网页打开,需要另存为sc_unicode.txt文件)

  1. 执行压缩命令(注意字体文件和字体列表编码文件要放在同一个目录下面)
javascript">pyftsubset qijifallback.ttf --unicodes-file=sc_unicode.txt
// `qijifallback.ttf`(要压缩的字体文件)
// `sc_unicode.txt`(字体编码列表文件)

解释:

qijifallback.ttf:要压缩的字体文件
sc_unicode.txt:字体编码列表文件

压缩命令执行完毕后,会在当前目录出现压缩过的字体库qijifallback.subset.ttf


  1. 使用在线压缩工具 cloudconvert官网 ,将ttf文件转换成woff2文件(进一步压缩大小)

在这里插入图片描述


总结

经过亲自测试,压缩后依旧可用并且字体样式没受影响,从37M压缩到5.28M,压缩比例达到80%


最后再分享一个免费可商用的字体网站:https://www.ecan5.com/font/


http://www.niftyadmin.cn/n/5185495.html

相关文章

调用电商集成平台 聚水潭 api接口示例

先上工具类 package com.zuodou.utlis;import org.springframework.beans.factory.annotation.Value; import org.springframework.stereotype.Component;import javax.xml.crypto.Data; import java.io.*; import java.net.HttpURLConnection; import java.net.URL; import j…

mybatis-plus3.5.3.1 支持不同数据源sql适配

mybatis-plus3.5.3.1 支持不同数据源sql适配 背景 最近公司要求支持国产数据库达梦,人大金仓,高斯等数据库,这些数据库与mysql的语法有一些差异,需要做一些兼容操作。 解决问题 1.不同数据库分页不同 2.支持通过参数控制执行…

rocketmq 安装dashboard1.0.0 mq消息控制台安装 rocketmq控制台安装 rocketmq-dashboard-1.0.0编译安装

1. 官网: 下载 | RocketMQ 2. dashboard安装包位置: 在连接最下面,点击download.zip即可 3. 需要安装maven, 编译命令: mvn clean install -U -Dmaven.test.skiptrue4. 启动jar: java -jar rocketmq-dashboard-1.0.0.jar &…

day57

今日内容概要 模板层 模板之过滤器 模板之标签(if else for) 模板之继承 导入模板 模型层 单表的操作 十几种常见的查询方法 基于下划线的查询方法 外键字段的增删改查 正反向查询(多表跨表) 模板之过滤器 语法: {{obj|filter__name:param}} 变量名字|…

uniapp地图手动控制地图scale

前言 首次使用uniapp开发地图过程中,发现uniapp地图居然没有提供手动控制地图scale的方法,这个也着实没有想到,查了半天资料,也终于找到一个方法能够比较好的控制scale,做个记录。 代码 要定义一个地图map&#xff…

Oracle 查找非系统用户结合了10,11,12,19

oracle 12开始有了INHERITED=YES;字段来区分系统用户 select username from dba_users where INHERITED=YES; 对于12以下的版本,按created日期字段筛选会发现创建时间间隔比较大,好区分。 本人当前有个需求需要找出所有数据库的非系统用户,来做数据库合理性分析,批量扫的…

博物馆信息展示预约小程序的效果如何

随着大环境放开,如博物馆等场所也开始了正常营业,而这些场所在市场中中的需求度很广,每天客流量也相对可观。 但依然发现博物馆痛点所在。 通过【雨科】平台搭建博物馆小程序展示所有内容信息,覆盖微信、百度、头条、抖音、支付宝…

NewStarCTF2023 Week3 Reverse方向 题目STL WP

分析 代码不多&#xff0c;逻辑挺清楚的。 先用Z3解出V7&#xff1a; from z3 import *s Solver() v1, v2, v3, v4, v5, v6 BitVecs(v1 v2 v3 v4 v5 v6, 32) v7, v8, v9, v10, v11 BitVecs(v7 v8 v9 v10 v11, 32)s.add((v1 << 15) ^ v1 0x2882D802120E) s.add((v2 …