前端中文字体压缩 font-spider

        中文字体和英文字体相比要大很多，英文说白了就26个字母，而汉字就没有那么幸运了，所以一般前端中文字体文件都比较大，如果站点带宽ia不够的话，加载会比较缓慢，所以我们要想办法压缩下字体大小，无非就是只在字体文件中包含我们需要的汉字。
        字蛛（FontSpider）通过分析本地 CSS 与 HTML 文件获取 WebFont 中没有使用的字符，并将这些字符数据从字体中删除以实现压缩，同时生成跨浏览器使用的格式。
        安装字蛛

npm install font-spider -g

在 CSS 中使用 WebFont：

/*声明 WebFont*/
@font-face {
  font-family: 'pinghei';
  src: url('../font/pinghei.eot');
  src:
    url('../font/pinghei.eot?#font-spider') format('embedded-opentype'),
    url('../font/pinghei.woff') format('woff'),
    url('../font/pinghei.ttf') format('truetype'),
    url('../font/pinghei.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

/*使用选择器指定字体*/
.home h1, .demo > .test {
    font-family: 'pinghei';
}

1. @font-face 中的 src 定义的 .ttf 文件必须存在，其余的格式将由工具自动生成
2. 开发阶段请使用相对路径的 CSS 与 WebFont
运行 font-spider 命令，压缩字体：

font-spider ./demo/*.html

font-spider 会自动读取html 文件中的汉字来进行筛选，从而实现字体压缩，缺点就是只能从静态文件压缩，如果需要动态筛选你需要
https://github.com/allanguys/font-spider-plus
除了兼容font-spider（字蛛）支持的特性：
压缩字体：智能删除没有被使用的字形数据，大幅度减少字体体积
生成字体：支持 woff2、woff、eot、svg 字体格式生成
font-spider-plus（字蛛+）还具有以下特性：
支持线上动态渲染的页面
支持线上GBK编码的文件