JSDelivr 国内加速技巧｜通过括彩云公益镜像实现高速访问体验

什么是 jsDelivr？

jsDelivr 是一个非常受欢迎的国外免费 CDN 服务平台，用于加载 JavaScript、CSS、图片等静态资源，能显著减轻服务器压力并加快网站访问速度。

但近年来，由于国内滥用及相关政策原因，jsDelivr 在中国大陆的备案被撤销，导致国内节点被关闭，访问速度变慢，对国内用户体验较差。

jsDelivr 的基本使用方式

jsDelivr 的使用方式非常灵活，主要包括以下几种：

加载 JavaScript 库

例如加载 jQuery：

1
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
  • npm/：使用 NPM 源
  • jquery@3.6.0：指定库名称和版本
  • dist/jquery.min.js：实际资源路径

可以不写版本号加载最新版本，但强烈建议写死版本避免意外更新导致项目出错。

加载 CSS 文件

例如加载 Bootstrap：

1
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">

加载图片等静态资源（GitHub 仓库）

1
<img src="https://cdn.jsdelivr.net/gh/user/repo@version/path/to/image.png">
  • 使用 GitHub 仓库资源（gh 源）
  • user/repo：用户名+仓库名
  • @version：可选版本
  • /path/to/image.png：文件路径

jsDelivr 支持的资源源（加速类型）

jsDelivr 的优缺点

优点：

  • 成熟的全球网络：在海外拥有广泛的节点和出色的性能，是国际化项目的首选。
  • 生态丰富，支持广泛：支持 NPM、GitHub 等多种源，几乎无所不包。
  • 免费且社区驱动：为开源社区提供了巨大的便利，降低了开发门槛。
  • 强大的版本控制：允许你精确锁定资源版本，保证项目稳定性。

缺点：

  • 国内访问速度是其“阿喀琉斯之踵”：自备案被撤销后，国内访问质量时好时坏，尤其在网络高峰期或特定地区，延迟和丢包现象严重。
  • 存在被进一步限制的风险：由于其服务特性，未来仍可能面临国内网络环境的政策变动。

括彩云加速 —— 国内优化方案

什么是“括彩云”？

括彩云是一个面向国内的 jsDelivr 替代服务，由括彩云国内CDN提供支持，专注为中国用户提供更快、更稳定的静态资源加载体验。

地址如下：

1
cdn.iocdn.cc

优势：

  • 国内优先策略：所有 CDN 节点均部署在中国大陆，由国内顶尖的云服务商提供支持，从根本上解决了跨境访问的延迟问题。
  • 无缝迁移体验：其 URL 结构刻意模仿 jsDelivr，用户几乎只需替换域名即可完成迁移，学习成本极低。
  • 高带宽与稳定性：作为公益项目，它依然提供了充足的带宽资源，确保了在常规使用下的流畅体验。

注意事项：

括彩云虽然稳定，但仍是公益服务，请不要滥用：

  • 禁止加速图床、视频等大文件资源
  • 不建议加速字体文件，因其频繁变更且体积大

如何测速括彩云的性能？

你可以通过以下方式验证它的加速效果：

  • Chrome 浏览器 F12 → Network 选项卡：查看资源加载速度

    • 打开你的网站，按 F12 键打开开发者工具，切换到 Network (网络) 选项卡。
    • 强制刷新页面 (Ctrl + F5 或 Cmd + R)。
    • 在下方的资源列表中，找到以 cdn.iocdn.cc 开头的资源，查看其 Time (加载时间) 列。通常，你会看到几十毫秒甚至更快的响应速度。

  • 使用在线测速网站（如 itdog.cn）

    • 输入一个括彩云的资源 URL，例如 https://cdn.iocdn.cc/npm/jquery@3.6.0/dist/jquery.min.js。
    • 查看全国各地的测速节点的延迟和下载速度，结果一目了然。

测试结论：对于目标用户在大陆的网站，括彩云的速度和稳定性远超当前 jsDelivr 的表现；但如果你的网站主要服务海外用户，那么继续使用 jsDelivr 仍然是更合适的选择。
如果网站面向国内用户，非常推荐使用括彩云；若服务面向海外，建议继续使用 jsDelivr。

Hexo 博客中如何使用智云 CDN？

几乎所有现代 Hexo 主题都支持自定义 CDN。这里的关键是找到主题配置文件中关于 CDN 的设置项。

以 hexo-theme-anzhiyu 主题为例，配置步骤如下：

找到主题配置文件

1
_config.anzhiyu.yml

修改 CDN 设置

将 CDN 设置为 custom：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
CDN:
  # The CDN provider of internal scripts (主题内部 js 的 cdn 配置)
  # option: local/elemecdn/jsdelivr/unpkg/cdnjs/onmicrosoft/cbd/anheyu/custom
  # Dev version can only choose. ( dev版的主题只能设置为 local )
  internal_provider: local

  # The CDN provider of third party scripts (第三方 js 的 cdn 配置)
  # option: elemecdn/jsdelivr/unpkg/cdnjs/onmicrosoft/cbd/anheyu/custom
  third_party_provider: custom

  # Add version number to CDN, true or false
  version: true

  # Custom format
  # For example: https://cdn.staticfile.org/${cdnjs_name}/${version}/${min_cdnjs_file}
  custom_format: https://cdn.iocdn.cc/npm/${name}@${version}/${min_file}

启用自定义 CDN 选项 (provider: custom)。
提供括彩云的 URL 模板 (custom_format)，其中的 ${name}, ${version}, ${min_file} 是主题会自动替换的占位符。

重新部署

1
2
3
hexo clean
hexo generate
hexo deploy

验证是否成功

部署完成后，打开你的网站，通过浏览器 F12 的“源代码”或“网络”面板，检查页面引用的 JS/CSS 资源路径是否已成功替换为 cdn.iocdn.cc。

如果你使用的是其他主题，也可以参考类似配置，自行修改。

总结

jsDelivr 是一个国际知名的 CDN，但对国内用户来说，访问速度受限。而“括彩云”作为替代方案，提供了免费、高速、稳定的国内加速服务。

为了让大家都能长期享受该服务，我们要：

  • 不滥用
  • 不消耗过多带宽
  • 共同维护这个公益项目

最后，向括彩云及其背后的贡献者们致以诚挚的感谢！

括彩云官网： https://www.kuocaicdn.com