CDN

你可能会说

外地用户说图片加载慢，能不能让他们从就近的地方下载？

把图片和网页文件的副本放到多个地区，让用户从较近的位置加载例如，深圳和新加坡的用户打开同一张产品图时，可以分别从附近节点获取。CDN 不会自动解决后端慢的问题，更新文件时也要处理旧缓存。
先知道
域名 DomainDNS
也常被叫作CDN 加速内容分发网络
🖥️源站文件原件
→
📍 香港节点（副本）18ms
📍 法兰克福节点（副本）22ms
📍 洛杉矶节点（副本）26ms

什么时候用

  • 把适合缓存的图片、JS、CSS 等资源交给 CDN，通常能减少源站距离和负载，但仍要测真实访问
    logo.pngCDN
    app.jsCDN
    CDN 可缓存并分发静态资源
  • 用托管平台部署时，确认 CDN 是否启用、覆盖区域和缓存规则，不要假定每次发布都会全球同步
    部署成功，已分发至全球节点
  • 让用户由合适的边缘节点获取内容；节点不一定物理最近，实际速度还受网络和缓存命中影响
    深圳用户香港节点 · 18ms
    柏林用户法兰克福 · 22ms
  • 文件更新后刷新缓存（Purge），节点重新回源取新文件
    logo.png 更新了刷新缓存
    Purge 后节点重新回源取新文件

什么时候不用

  • 大图片全从源站直出：海外用户每张图都在转圈
    柏林用户直连源站 · 380ms
    用户与源站距离较远时，资源传输延迟会增加
  • 改了图文件名不变：节点还在发旧缓存，用户看到旧图
    logo.png缓存 30 天
    缺少版本化或刷新策略时，用户可能继续看到旧资源
  • 把实时数据也长时间缓存：余额、库存全是旧数据
    /api/balance缓存 1 小时
    账户余额等私有动态数据需要严格的缓存策略与鉴权隔离
  • HTML 缓存设一年：发了新版，用户死活刷不出来
    index.html缓存 1 年
    缓存期过长且没有更新策略时，用户可能继续看到旧版本
组成结构 · Anatomy
🖥️源站→📍 香港节点18ms📍 法兰克福节点22ms缓存 30 天
文件的原件，只有节点没存货时才被取用
离用户近的分发仓，存着文件副本直接发
节点把文件留一份的时长；到期或 Purge 才回源换新
常见变体 · Variants
静态资源加速Static Assets
cdn.vibeui.dev/logo.png
图片、JS、CSS 放边缘节点发
全站加速Full Site
vibeui.dev Edge
HTML 也走节点，动态部分回源
对象存储 + CDNOSS + CDN
uploads.vibeui.dev/u/8f2k.jpg
用户上传的图也交给 CDN 发
典型使用场景
部署成功全球分发
🚀
部署成功
vibeui.dev 已更新，用时 38 秒
✓ 已分发至 26 个边缘节点
静态资源经全球 CDN 加速，HTTPS 证书已自动续期
节点与延迟对照
边缘节点 · 实时延迟
📍 香港 服务：深圳、广州 18ms
📍 法兰克福 服务：柏林、巴黎 22ms
📍 洛杉矶 服务：旧金山、西雅图 26ms
同一批文件，每个用户都从最近的节点取
缓存命中率看板
CDN 缓存 · 最近 7 天
缓存命中率
92.4%
回源请求
7.6%
源站带宽省下
86 GB
九成多的请求在节点就解决了，源站几乎没压力
手动刷新缓存
刷新缓存
让全球节点丢掉旧文件，重新回源取最新版
✓ 已刷新 26 个节点，约 30 秒内全球生效
延伸阅读 · 权威出处
CDN 词汇表MDN ↗内容分发网络（CDN）web.dev ↗