在 2023 年评测前端静态资源公共 CDN - kkocdko's blog

还记得我才接触前端时（啊，那时我还很年轻——）hhhhh 不多说了，总之当下前端工程化后，大家都把东西塞进 Bundle 了，曾经很重要的“前端静态资源公共 CDN”也似乎即将成为时代的眼泪。然而对于一些写 Demo 之类的需求，它们还是有点用的，再加上目前互联网上对静态资源公共 CDN 的评测文章大多过时，于是我测试并总结了一下。本次测试使用 curl 和 hyperfine 并切换多个代理节点（是的我知道这不精确）。

TLDR: 境外 jsDelivr / UNPKG 任选，境内推荐 npmmirror，境内外都有需求建议 npmmirror 但不完美。如使用特别流行的库，也可使用 cdnjs 或其他国内 CDN。

前端公共 CDN 目前大致分两类，一类是 cdnjs 这种需提交审核的，另一类是 jsDelivr 这种镜像 NPM 的。前一类的代表自然是 Cloudflare cdnjs，或者 Google 的 CDN。国内此类 CDN 通常以 cdnjs 为上游进行同步。BootCDN 曾经很流行，但曾有多次事故，恐怕用起来还需谨慎。

后一类是本文重点，许多时候我们写的 Demo 所需的库并未被 cdnjs 收录，提交审核又太费时费力，所以我偏好使用直接镜像 NPM 的公共 CDN。

分别是 npmmirror（淘宝 NPM 镜像），饿了么 UNPKG CDN，UNPKG，jsDelivr。我们的测试命令：

testonce(){ ./hyperfine -w 2 -r 10 -p "sleep 1" -u millisecond "curl $1 >/dev/null" ;}
testonce https://registry.npmmirror.com/@fontsource/noto-serif-sc/5.0.3/files/files/noto-serif-sc-chinese-simplified-400-normal.woff2
testonce https://npm.elemecdn.com/@fontsource/noto-serif-sc@5.0.3/files/noto-serif-sc-chinese-simplified-400-normal.woff2
testonce https://unpkg.com/@fontsource/noto-serif-sc@5.0.3/files/noto-serif-sc-chinese-simplified-400-normal.woff2
testonce https://cdn.jsdelivr.net/npm/@fontsource/noto-serif-sc@5.0.3/files/noto-serif-sc-chinese-simplified-400-normal.woff2

得到结果：

江苏镇江某大学校园网：

Brand	mean ± σ
npmmirror	594.9 ms ± 65.4 ms
Eleme CDN	627.1 ms ± 74.7 ms
UNPKG	3820.7 ms ± 1209.7 ms
jsDelivr	Timeout (> 5 s)

江苏镇江移动 4G：

Brand	mean ± σ
npmmirror	1570.4 ms ± 316.1 ms
Eleme CDN	1545.3 ms ± 203.4 ms
UNPKG	3514.2 ms ± 1278.3 ms
jsDelivr	Reset

阿里云 ECS 新加坡：

Brand	mean ± σ
npmmirror	82.8 ms ± 3.5 ms
Eleme CDN	961.7 ms ± 79.7 ms
UNPKG	79.5 ms ± 12.2 ms
jsDelivr	73.6 ms ± 26.7 ms

Azure 日本（机场全局，不精确）：

Brand	mean ± σ
npmmirror	985.8 ms ± 92.9 ms
Eleme CDN	5897.9 ms ± 1085.7 ms
UNPKG	901.6 ms ± 59.5 ms
jsDelivr	876.6 ms ± 24.7 ms

Azure 美国（机场全局，不精确）：

Brand	mean ± σ
npmmirror	2331.3 ms ± 190.0 ms
Eleme CDN	Timeout (> 5 s)
UNPKG	2144.2 ms ± 92.8 ms ms
jsDelivr	2496.5 ms ± 116.4 ms

总结：jsDelivr 曾经是完美的选择，但自从证书吊销事件后在大陆地区的访问就不是很正常；UNPKG 表现一般，至少都能用；npmmirror 在境外也有节点，虽然不如 jsDelivr 那么多，但是均衡的选择；饿了么 CDN 仅适合无境外访问需求的场景。

推荐订阅源

kkocdko's blog