面对10M的字体文件，通过font-spider和FontMin进行优化，将字体文件压缩至38KB。font-spider可能无法处理动态内容，而FontMin提供手动输入字符的压缩方式。文章介绍了使用gulp整合font-spider的步骤，并提醒注意CSS引用路径、python环境和文件备份设置。
这次项目中UI小姐姐要求用平方等其他字体，遂引入了这些字体，打包的时候发现，OMG，一个字体文件竟然要10M，实在不能忍，于是开始了字体文件大小的优化实践，最后变成38KB一个，还行吧。
解决思路
font-spider 字蛛 原理是通过爬取 HTML 文件以及关联的CSS，找到设置了字体的样式，再爬取相关的的字符，排序去重，最后只针对这些字符保留字体文件相应的字符，从而达到大大缩小文件体积大小的目的。
缺点 ：从它的原理可易知，它的致命缺陷就是有可能无法保留js脚本动态添加的字符的字体文件，及对于页面中存在大量文字动态删减增加等情况不够友好，如果是这种情况下，建议再找别的解决方案。
打包 ：存在 gulp 以及 grunt 相关插件的解决方案，也可以通过控制台输入指令来生成压缩后的字体文件
FontMin 其实这个与字蛛差不多相同，字蛛有的它都有，但值得一提的是，FontMin 还有个应用文件版本，可以通过拖动字体文件和手动输入可能存在的字符来压缩字体文件。
font-spider
gulp-font-spider
可能存在的坑！！！
当然你都用 gulp 了，肯定得先 安装 node ，把gulp相关的大概整明白(了解？)吧
需要有 python 环境 ，推荐 python 2.7 版本的
文件路径确保正确且当你运行 fontSpider 已存在
如果压缩后的字体文件出现了，但是大小没变或者变化不明显，很大可能是源字体文件的问题
最低0.47元/天 解锁文章
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
