GithubHelp home page GithubHelp logo

konghayao / cn-font-split Goto Github PK

View Code? Open in Web Editor NEW
234.0 4.0 10.0 3.77 MB

划时代的字体切割工具,CJK与任何字符!支持 otf、ttf、woff2 字体多线程切割,完美地细颗粒度地进行包大小控制。A revolutionary font subetter that supports CJK and any characters! It enables multi-threaded subset of otf, ttf, and woff2 fonts, allowing for precise control over package size.

Home Page: https://chinese-font.netlify.app/

License: Apache License 2.0

HTML 6.70% JavaScript 20.63% TypeScript 70.50% CSS 2.17%
converter font font-subset font-subsetter opentype-fonts otf performance ttf wasm woff2

cn-font-split's People

Contributors

code-factor avatar dependabot[bot] avatar jynxio avatar konghayao avatar konghayao-bot avatar richex-cn avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

cn-font-split's Issues

[bug] 相同字体文件执行2次切割产物分片不同

当前行为

对同一字体文件执行两次分割,产物分片不同

预期结果

相同字体文件在不改变参数的前提下,多次分割的产物相同


附2次执行结果

result 1

INFO    -->                     Start
INFO    [email protected] 环境检测    node
TRACE   输入文件大小:10.2 MB
INFO    <--     15ms            Done
INFO    -->                     Start
INFO    <--     2ms             Done
INFO    -->                     Start
INFO    <--     21ms            Done
INFO    -->                     Start
INFO    <--     0ms             Done
INFO    -->                     Start
INFO    <--     27ms            Done
INFO    -->                     Start
INFO    <--     1ms             Done
INFO    -->                     Start
TRACE   总字符数 28441
INFO    减少分包碎片 17 => 17
INFO    <--     279ms           Done
INFO    -->                     Start
TRACE   开始分包 分包数 94
TRACE   序号    hb      woff2   大小/字符       名称
TRACE   8       1ms     401ms   9.7 kB/237      b770bfb
TRACE   13      1ms     454ms   52.9 kB/253     b647a14
TRACE   10      1ms     469ms   71.2 kB/245     78a297c
TRACE   11      1ms     469ms   67.0 kB/248     6e3ef9a
TRACE   16      1ms     464ms   62.1 kB/258     49d0174
TRACE   18      3ms     506ms   42.8 kB/342     6c82359
TRACE   12      1ms     539ms   63.2 kB/249     01e60c7
TRACE   9       1ms     557ms   60.5 kB/237     331f5ea
TRACE   14      1ms     550ms   62.8 kB/254     76aba4b
TRACE   17      3ms     570ms   12.9 kB/342     a13afa0
TRACE   15      1ms     591ms   55.2 kB/257     1103d0b
TRACE   2       1ms     647ms   60.1 kB/208     78b87d0
TRACE   4       1ms     649ms   60.7 kB/216     3c3dfcd
TRACE   0       1ms     690ms   29.1 kB/128     405e4a0
TRACE   7       1ms     685ms   59.2 kB/233     574667b
TRACE   6       1ms     694ms   61.2 kB/223     9350263
TRACE   1       1ms     732ms   59.5 kB/207     0c3827d
TRACE   3       1ms     762ms   56.9 kB/215     00807d2
TRACE   19      3ms     733ms   51.9 kB/342     3c3ee90
TRACE   5       1ms     776ms   57.0 kB/218     03b7de6
TRACE   20      1ms     777ms   53.7 kB/342     d1fb0d6
TRACE   21      2ms     795ms   57.1 kB/342     9241e5f
TRACE   22      2ms     811ms   60.2 kB/342     4c75e9c
TRACE   23      1ms     815ms   61.3 kB/342     45c624c
TRACE   24      3ms     848ms   61.7 kB/342     fb4c6c3
TRACE   25      1ms     860ms   63.2 kB/342     8ec5bc7
TRACE   26      1ms     880ms   63.0 kB/342     db5c35b
TRACE   27      1ms     881ms   63.3 kB/342     2d55042
TRACE   28      1ms     925ms   64.5 kB/342     9ce86f0
TRACE   29      2ms     930ms   66.0 kB/342     2ef566b
TRACE   30      1ms     953ms   65.0 kB/342     87f6d60
TRACE   31      1ms     954ms   64.2 kB/342     69c9fd3
TRACE   32      1ms     998ms   65.3 kB/342     7e06492
TRACE   33      1ms     1008ms  66.2 kB/342     ea02106
TRACE   35      1ms     1027ms  68.8 kB/333     3040809
TRACE   34      1ms     1030ms  67.0 kB/342     1e5d4de
TRACE   38      1ms     1057ms  16.5 kB/342     8bf04e9
TRACE   36      1ms     1074ms  69.3 kB/338     5392789
TRACE   37      1ms     1088ms  61.0 kB/306     2ea5afc
TRACE   39      1ms     1106ms  59.0 kB/342     4d3c791
TRACE   40      1ms     1130ms  60.9 kB/342     213809b
TRACE   41      1ms     1151ms  64.3 kB/342     3cefe76
TRACE   42      1ms     1169ms  63.9 kB/342     d831f12
TRACE   43      1ms     1196ms  68.0 kB/322     ae4e69b
TRACE   44      1ms     1201ms  63.1 kB/328     f210cb8
TRACE   45      1ms     1237ms  71.6 kB/334     d4e6bb4
TRACE   46      1ms     1248ms  71.6 kB/309     c73c3ef
TRACE   48      1ms     1269ms  58.3 kB/310     004ecc7
TRACE   47      1ms     1275ms  64.2 kB/316     9538ee1
TRACE   49      1ms     1316ms  66.1 kB/317     62b0d2a
TRACE   50      1ms     1322ms  61.3 kB/304     b12d2b9
TRACE   51      1ms     1351ms  60.0 kB/305     12d2441
TRACE   52      1ms     1354ms  62.1 kB/275     ffa1002
TRACE   53      1ms     1390ms  59.7 kB/290     de65ead
TRACE   54      1ms     1395ms  59.7 kB/304     07b75ba
TRACE   56      1ms     1413ms  49.0 kB/342     fdb4071
TRACE   55      1ms     1424ms  62.8 kB/274     cccf6ab
TRACE   58      1ms     1453ms  53.4 kB/342     a86a686
TRACE   57      1ms     1465ms  63.5 kB/342     c9bc423
TRACE   59      1ms     1482ms  56.8 kB/322     203bd36
TRACE   60      1ms     1494ms  57.4 kB/342     6adbd55
TRACE   61      1ms     1533ms  67.3 kB/342     0375443
TRACE   62      1ms     1545ms  61.7 kB/342     bb3d28a
TRACE   63      1ms     1553ms  59.9 kB/324     7c941eb
TRACE   64      1ms     1569ms  63.1 kB/342     2c84b02
TRACE   67      1ms     1628ms  60.5 kB/333     2545135
TRACE   65      1ms     1630ms  71.7 kB/341     0d6e661
TRACE   66      1ms     1632ms  65.9 kB/296     b39b795
TRACE   68      1ms     1646ms  56.6 kB/342     9841a7a
TRACE   70      1ms     1704ms  61.7 kB/262     611260f
TRACE   69      1ms     1711ms  59.8 kB/285     4ad4d41
TRACE   71      1ms     1712ms  61.4 kB/342     ba6ca92
TRACE   72      1ms     1725ms  67.5 kB/292     f931518
TRACE   75      1ms     1790ms  62.0 kB/316     a51d4e8
TRACE   74      1ms     1795ms  70.7 kB/303     d19300b
TRACE   73      1ms     1797ms  69.8 kB/298     72951f6
TRACE   76      1ms     1804ms  62.5 kB/308     7dd106b
TRACE   77      1ms     1868ms  55.9 kB/342     b4ee328
TRACE   78      1ms     1870ms  59.0 kB/294     c317496
TRACE   79      1ms     1875ms  65.0 kB/300     0a335de
TRACE   80      1ms     1885ms  65.4 kB/270     2999718
TRACE   81      1ms     1951ms  63.0 kB/267     50c6e36
TRACE   83      1ms     1953ms  55.4 kB/342     556deed
TRACE   82      1ms     1964ms  61.5 kB/298     2532f37
TRACE   84      1ms     1982ms  59.7 kB/277     048cb9b
TRACE   87      1ms     2037ms  51.1 kB/263     2d6b839
TRACE   86      1ms     2039ms  57.9 kB/292     ecd0339
TRACE   85      1ms     2051ms  61.1 kB/274     45dd430
TRACE   88      1ms     2074ms  61.3 kB/290     4e649d8
TRACE   89      1ms     2111ms  53.4 kB/278     df78429
TRACE   90      1ms     2123ms  59.3 kB/311     f8528a8
TRACE   91      1ms     2143ms  62.5 kB/295     94e041f
TRACE   92      1ms     2159ms  60.2 kB/316     d6e1b1d
TRACE   93      1ms     2186ms  51.2 kB/259     bb130bb
TRACE   结束分包
INFO    <--     2295ms          Done
INFO    -->                     Start
INFO    <--     1ms             Done
INFO    -->                     Start
INFO    <--     4ms             Done
INFO    -->                     Start
INFO    <--     394ms           Done
INFO    -->                     Start
INFO    <--     1ms             Done

result 2

INFO    -->                     Start
INFO    [email protected] 环境检测    node
TRACE   输入文件大小:10.2 MB
INFO    <--     13ms            Done
INFO    -->                     Start
INFO    <--     2ms             Done
INFO    -->                     Start
INFO    <--     17ms            Done
INFO    -->                     Start
INFO    <--     0ms             Done
INFO    -->                     Start
INFO    <--     27ms            Done
INFO    -->                     Start
INFO    <--     0ms             Done
INFO    -->                     Start
TRACE   总字符数 28441
INFO    减少分包碎片 17 => 17
INFO    <--     283ms           Done
INFO    -->                     Start
TRACE   开始分包 分包数 94
TRACE   序号    hb      woff2   大小/字符       名称
TRACE   5       1ms     441ms   57.0 kB/218     2d960e0
TRACE   3       1ms     446ms   56.9 kB/215     9b3dd6b
TRACE   1       1ms     450ms   59.5 kB/207     68344de
TRACE   2       1ms     458ms   60.1 kB/208     44e092a
TRACE   18      1ms     483ms   42.8 kB/342     6c82359
TRACE   11      1ms     522ms   67.0 kB/248     6e3ef9a
TRACE   7       1ms     534ms   59.2 kB/233     574667b
TRACE   10      1ms     535ms   71.2 kB/245     78a297c
TRACE   17      2ms     525ms   12.9 kB/342     a13afa0
TRACE   16      1ms     596ms   62.1 kB/258     eb33891
TRACE   15      1ms     600ms   55.2 kB/257     1103d0b
TRACE   14      1ms     609ms   62.8 kB/254     76aba4b
TRACE   9       1ms     630ms   60.5 kB/237     331f5ea
TRACE   8       1ms     633ms   9.7 kB/237      b770bfb
TRACE   0       1ms     677ms   29.1 kB/128     b8417c8
TRACE   13      1ms     676ms   52.9 kB/253     876e877
TRACE   6       1ms     705ms   61.2 kB/223     91be3fa
TRACE   12      1ms     709ms   63.2 kB/249     093f18c
TRACE   19      1ms     732ms   51.9 kB/342     f09a671
TRACE   4       1ms     756ms   60.7 kB/216     b4686b3
TRACE   20      1ms     748ms   53.7 kB/342     faa5ad9
TRACE   21      1ms     764ms   57.1 kB/342     9241e5f
TRACE   23      1ms     795ms   61.3 kB/342     45c624c
TRACE   22      1ms     805ms   60.2 kB/342     f7842e9
TRACE   24      1ms     826ms   61.7 kB/342     fb4c6c3
TRACE   25      1ms     830ms   63.2 kB/342     c264b5c
TRACE   27      3ms     870ms   63.3 kB/342     db82ebb
TRACE   26      1ms     875ms   63.0 kB/342     db5c35b
TRACE   28      4ms     899ms   64.5 kB/342     9ce86f0
TRACE   29      2ms     898ms   66.0 kB/342     b8151db
TRACE   30      5ms     945ms   65.0 kB/342     0e10fdb
TRACE   31      1ms     947ms   64.2 kB/342     12ab859
TRACE   33      1ms     968ms   66.2 kB/342     201e926
TRACE   32      2ms     970ms   65.3 kB/342     7e06492
TRACE   35      1ms     1020ms  68.8 kB/333     790bc25
TRACE   34      1ms     1026ms  67.0 kB/342     bb90f3b
TRACE   37      1ms     1037ms  61.0 kB/306     2ea5afc
TRACE   36      1ms     1047ms  69.3 kB/338     1db4b5f
TRACE   38      1ms     1049ms  16.5 kB/342     8bf04e9
TRACE   39      1ms     1090ms  59.0 kB/342     4d3c791
TRACE   40      1ms     1102ms  60.9 kB/342     f3c7185
TRACE   41      2ms     1121ms  64.3 kB/342     ddaa38a
TRACE   42      2ms     1122ms  63.9 kB/342     d831f12
TRACE   43      1ms     1171ms  68.0 kB/322     ae4e69b
TRACE   44      1ms     1171ms  63.1 kB/328     727d600
TRACE   46      1ms     1204ms  71.6 kB/309     e2d108d
TRACE   45      1ms     1209ms  71.6 kB/334     04575c8
TRACE   48      1ms     1241ms  58.3 kB/310     004ecc7
TRACE   47      1ms     1251ms  64.2 kB/316     bfd9257
TRACE   50      1ms     1283ms  61.3 kB/304     b12d2b9
TRACE   49      1ms     1285ms  66.1 kB/317     f63cae6
TRACE   51      1ms     1328ms  60.0 kB/305     ca18a90
TRACE   52      1ms     1329ms  62.1 kB/275     0273a44
TRACE   54      1ms     1361ms  59.7 kB/304     1724bf4
TRACE   53      1ms     1362ms  59.7 kB/290     de65ead
TRACE   56      1ms     1395ms  49.0 kB/342     8d9e61e
TRACE   55      1ms     1410ms  62.8 kB/274     732be74
TRACE   58      1ms     1422ms  53.4 kB/342     5d53700
TRACE   57      1ms     1442ms  63.5 kB/342     941be52
TRACE   59      1ms     1468ms  56.8 kB/322     203bd36
TRACE   60      1ms     1485ms  57.4 kB/342     6adbd55
TRACE   61      1ms     1503ms  67.3 kB/342     0375443
TRACE   62      1ms     1518ms  61.7 kB/342     9129b7f
TRACE   63      1ms     1540ms  59.9 kB/324     ad6220c
TRACE   64      1ms     1557ms  63.1 kB/342     89b6d88
TRACE   65      1ms     1599ms  71.7 kB/341     0d6e661
TRACE   66      1ms     1606ms  65.9 kB/296     b39b795
TRACE   67      1ms     1622ms  60.5 kB/333     313cffe
TRACE   68      1ms     1631ms  56.6 kB/342     9841a7a
TRACE   69      1ms     1686ms  59.8 kB/285     4ad4d41
TRACE   70      1ms     1692ms  61.7 kB/262     a3eb0ee
TRACE   72      1ms     1708ms  67.5 kB/292     f931518
TRACE   71      1ms     1711ms  61.4 kB/342     ba6ca92
TRACE   74      1ms     1775ms  70.7 kB/303     74b07ac
TRACE   73      1ms     1779ms  69.8 kB/298     cb14029
TRACE   76      1ms     1797ms  62.5 kB/308     064c0da
TRACE   75      1ms     1797ms  62.0 kB/316     80d8629
TRACE   77      1ms     1854ms  55.9 kB/342     76694b9
TRACE   78      1ms     1855ms  59.0 kB/294     e1407c1
TRACE   79      1ms     1876ms  65.0 kB/300     0a335de
TRACE   80      1ms     1884ms  65.4 kB/270     94062e8
TRACE   81      1ms     1944ms  63.0 kB/267     3112759
TRACE   82      1ms     1946ms  61.5 kB/298     a940f06
TRACE   83      1ms     1958ms  55.4 kB/342     556deed
TRACE   84      1ms     1972ms  59.7 kB/277     048cb9b
TRACE   86      1ms     2023ms  57.9 kB/292     9afd6ba
TRACE   85      1ms     2027ms  61.1 kB/274     45dd430
TRACE   87      0ms     2027ms  51.1 kB/263     80a9748
TRACE   88      1ms     2054ms  61.3 kB/290     93a447f
TRACE   89      0ms     2097ms  53.4 kB/278     2d4a5ae
TRACE   91      1ms     2103ms  62.5 kB/295     94e041f
TRACE   90      1ms     2121ms  59.3 kB/311     bf8093c
TRACE   92      1ms     2136ms  60.2 kB/316     d6e1b1d
TRACE   93      1ms     2169ms  51.2 kB/259     bb130bb
TRACE   结束分包
INFO    <--     2272ms          Done
INFO    -->                     Start
INFO    <--     1ms             Done
INFO    -->                     Start
INFO    <--     4ms             Done
INFO    -->                     Start
INFO    <--     81ms            Done
INFO    -->                     Start
INFO    <--     1ms             Done

4.9.0 在 Node 中无法使用

https://codesandbox.io/p/sandbox/nodejs-cn-font-split-46jdgr?file=%2Findex.js%3A9%2C1

➜  workspace git:(master) ✗ node index.js
INFO    -->             LoadFile        Start
INFO    cn-font-split 环境检测   node
TRACE   输入文件大小:2.1 MB
INFO    <--     24ms    LoadFile        Done
INFO    -->             transferFontType        Start
INFO    <--     0ms     transferFontType        Done
INFO    -->             loadHarbuzz     Start
INFO    <--     17ms    loadHarbuzz     Done
INFO    -->             initOpentype    Start
file:///workspaces/workspace/node_modules/@konghayao/opentype.js/dist/opentype.js:13525
(function (root, factory) { if (typeof define === 'function' && define.amd)define(factory); else if (typeof module === 'object' && module.exports)module.exports = factory(); else root.opentype = factory(); }(typeof self !== 'undefined' ? self : this, () => ({...opentype,'default':opentype})));
                                                                                                                                                                                                 ^

TypeError: Cannot set properties of undefined (setting 'opentype')
    at file:///workspaces/workspace/node_modules/@konghayao/opentype.js/dist/opentype.js:13525:194
    at file:///workspaces/workspace/node_modules/@konghayao/opentype.js/dist/opentype.js:13525:208
    at ModuleJob.run (node:internal/modules/esm/module_job:192:25)
    at async DefaultModuleLoader.import (node:internal/modules/esm/loader:228:24)
    at async initOpentype (file:///workspaces/workspace/node_modules/@konghayao/cn-font-split/dist/index.js:1536:9)
    at async Executor.nextStep (file:///workspaces/workspace/node_modules/@konghayao/cn-font-split/dist/index.js:696:7)
    at async Executor.run (file:///workspaces/workspace/node_modules/@konghayao/cn-font-split/dist/index.js:721:14)
    at async fontSplit (file:///workspaces/workspace/node_modules/@konghayao/cn-font-split/dist/index.js:1667:3)

Node.js v20.5.1

是忽略了什么吗?

分包策略优化

这里目前是按unicode顺序做的分包,是否有考虑过按照字符使用频率做分包呢,这样或许能否拉尽可能少的分包就可以完成渲染

字体分包后丢失部分文字的字形

开发者你好!
我在使用喜鹊宋体时,通过在线分包工具对字体进行了子集化处理,然后将处理后的字体部署到 imagekit 进行测试。结果发现,部分常用汉字的字形显示异常或缺失。调用方式是没问题的,分包其他字体(试了京华老宋体)并部署没有发现这个问题。
使用在线分包工具的版本号:4.11.2,4.9.2
请问需要我提供什么其他信息吗?
image

[feature request] 希望可以通过配置以显式移除生成 css 中的 font-weight 字段

似乎没有办法取消默认的 css 的 font-weight 设置,这对 Variable Font 的不同字重比较致命。比较典的例子就是 Source Han Serif VF。

图片 and 图片

目前临时解决方案是在生成的 css 之后手动删除 font-weight。不清楚设置为 unset 会怎么样,但是这样有些似乎有些浪费了。

不过在 Variable Font 本身的字形切分上没有什么问题。(OTF 格式会报错,TTF 不会)

在线分包出现以下报错

image 使用在线分包出现以下报错: Cannot read properties of undefined (reading 'glyphIndexMap') 请问是什么原因呢?

[bug] unicode-range 选项干扰浏览器的渲染

vhal 特性,在竖排文本的情况下,浏览器渲染有问题。使用 unicode-range 会导致字体布局有非常轻微的抖动,但是删除 unicode-range,渲染效果又正常了

/* (),怪文新本测试难!(),? */
@font-face {
    font-family: "vhal-demo";
    src:url("./d1ccbed9a8130b735516321b853561f4.woff2") format("woff2");
-    unicode-range:U+28-29,U+2c,U+602a,U+6587,U+65b0,U+672c,U+6d4b,U+8bd5,U+96be,U+ff01,U+ff08-ff09,U+ff0c,U+ff1f;
}

Emoji字体分包

我尝试使用对Emoji字体进行分包

fontSplit({
FontPath: './NotoColorEmoji-Regular.ttf',
destFold: './build',
chunkSize: 70 * 1024,
testHTML: true,
reporter: true,
previewImage: {},
threads: {},
targetType: 'ttf',
css: {},
renameOutputFont: '[hash:10][ext]',
});

但是切割出来的字体大小远小于70kb,预览的时候也无法看到对应的emoji,是我使用方式的问题吗,还是不支持分割emoji

关于字体分割的技术讨论

开发者你们,首先需要感谢您们为字体切割所做的贡献,尤其是对 CJK 文字。
关于字体切割想请教一下技术问题。我还没深入使用过你们这个项目,从你们的描述和在线工具体验来看,你们其实是将一个大的字体文件拆成多个小的字体文件,最终还是需要将所有文字加载完成。
这是我的理解,可能有错误,还望见谅。
我目前有个想法,比如我的一篇文章中某种字体只使用了其中的十个汉字,但是按照目前的方案必须要将包含上千字的字体文件加载下来,即使使用了分割,也只是将字体文件拆小。我想的是能不能实现我传入这些文字或 Unicode 编码,工具自动处理,提取出只包含这十个汉字的字体文件,这样字体文件将会非常小。
会不会目前你们的方案是支持的这需求的,只是我没 get 到。如果暂不支持,你们这个分割方案能不能实现?
另外,据我了解,私自修改厂商的字体文件好像会有版权问题?即使是开源且商业免费的开源协议。这方面还望给一些指导性意见。非常感谢。

feat: 添加 CSS font-family

CSS 文件中完整的 src 属性应该包含 format 函数(参考自 Learn Responsive Design - Typography)。

@font-face {
    font-family: "霞鹜文楷";
    font-weight: 400;
    src: local("LXGW WenKai"),
         url("./lxgwwenkai-regular-400.woff2") format("woff2"),
         url("./lxgwwenkai-regular-400.woff") format("woff"),
         url("./lxgwwenkai-regular-400.ttf") format("turetype"),
         url("./lxgwwenkai-regular-400.otf") format("opentype");
}

woff2 错误,abort(TypeError: Failed to parse URL from /workspaces/font-server/api/temp/woff2/woff2.wasm) at Error

abort(TypeError: Failed to parse URL from /workspaces/font-server/api/temp/woff2/woff2.wasm) at Error
at jsStackTrace (/workspaces/font-server/api/temp/woff2/woff2.cjs:1037:23)
at stackTrace (/workspaces/font-server/api/temp/woff2/woff2.cjs:1051:22)
at process.abort (/workspaces/font-server/api/temp/woff2/woff2.cjs:814:54)
at process.emit (node:events:513:28)
at emit (node:internal/process/promises:150:20)
at processPromiseRejections (node:internal/process/promises:284:27)
at process.processTicksAndRejections (node:internal/process/task_queues:96:32)
(Use node --trace-uncaught ... to show where the exception was thrown)

一级 BUG: 字体解析错误

image

错误预估:glyf 内部有数据不规范导致解析出错了,字符出现于前半段部分,包含一些连字字符,可能为这个错误

可以支持自定义分包文件名吗?

主要是考虑优化网络传输数据量。

当前是用 hash 字符串作为文件名,也许可以支持自定义使用自增数字、短 hash 等?

例如短 hash:

9c80b303.woff2
43c9a8cf.woff2
...

自增数字:

0.woff2
1.woff2
...
24.woff2
...

或 Base 36:

0.woff2
1.woff2
...
z.woff2
...
0z.woff2
...
zz.woff2
...

甚至将字母、数字以及一些对所有系统、浏览器都兼容的字符加入进来:

-.woff2
_.woff2
^.woff2
...
-z.woff2
_z.woff2
...

虽然是个小优化,但也能一定程度减少网络传输数据量。

以 40 个文件为例,当前 32 位 hash 需要 32*40=1280 字节,使用自增数字只有 72 字节。

主要涉及的地方为 result.css 中的 url("***.woff2") 字体文件路径,以及每个字体文件请求路径。

CSS 文件通过 gzip 压缩可以降低请求数据量,但 HTTP 请求字体文件时的路径包含字体文件名无法压缩。

参考类似 Webpack 的 Template String

CLI 支持

可以考虑通过全局安装实现 CLI 支持,比起建一个目录然后安装依赖再分包要方便一些。

例如:

$ npm i -g @konghayao/cn-font-split
$ cn-font-split ./SourceHanSerifCN-Bold.ttf # 默认输出到字体文件同名目录 SourceHanSerifCN-Bold/
$ cn-font-split -o ./dist ./SourceHanSerifCN-Bold.ttf # 指定输出目录
$ cn-font-split --chunk-size 70k ./SourceHanSerifCN-Bold.ttf
$ cn-font-split --no-reporter ./SourceHanSerifCN-Bold.ttf
$ cn-font-split --no-html-reporter ./SourceHanSerifCN-Bold.ttf
$ cn-font-split --no-json-reporter ./SourceHanSerifCN-Bold.ttf
$ cn-font-split --chunk-name '[hash:8][ext]' ./SourceHanSerifCN-Bold.ttf

【test】Feature 检测

OpenType 的 Feature 需要进行切割的多种测试,需要一个具有各种特性的字体来保证检验合格。

[拆包失败] node 环境下报错

node 20 直接运行以下代码

import { fontSplit } from '@konghayao/cn-font-split';

fontSplit({
    FontPath: './myFont.ttf',
    destFold: './build',
    chunkSize: 70 * 1024,
    testHTML: true,
    reporter: true,
    threads: {},
    css: {},
    renameOutputFont: '[hash:10][ext]',
});

报错如下,且 build目录没有生成任何东西

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.