最近接手多个出海站点优化，发现一个共性问题：大部分性能问题，都是动静资源不拆分导致的。
静态资源长期回源、动态接口被错误缓存、页面资源串行阻塞，最后表现就是用户端打开慢、时不时卡顿、接口偶尔返回旧数据。
很多人优先扩容带宽、换节点、加机器，其实根本不用。做好动静分离，能解决 80% 的出海页面加载问题。
本文结合真实出海调优经验，讲清楚怎么拆分、怎么配置、怎么避坑，附可直接上线的规则和 Nginx 兜底方案。
一、动静不拆分，最容易出现的线上问题
- 静态资源每次都回源，缓存命中率低，浪费大量跨境带宽；
- 动态 API 被缓存，用户查询、订单、登录数据错乱、延迟不更新；
- 页面静态资源加载被动态接口阻塞，首屏空白时间长；
- 高峰期全站混跑，回源压力大，容易出现 504 超时；
- 排查问题困难，分不清是缓存问题还是接口问题。
二、出海业务动静资源划分标准（实战通用）
静态资源（全部走 CDN 缓存、就近加速） 图片、图标、JS、CSS、字体、视频、安装包、静态 HTML、公告页面
动态资源（禁止缓存、实时回源） /api/、/user/、/order/、/login/、后台管理、实时查询接口、支付回调
三、CDN 动静分离核心配置步骤
- 按目录、后缀批量匹配静态资源，开启长 TTL 缓存、智能压缩；
- 对所有动态接口路径，关闭缓存、设置实时回源策略；
- 动态请求单独优化回源超时、重试、链路调度；
- 静态资源开启预取、智能分片，提升弱网加载速度；
- 上线后观察缓存命中率、动态回源失败率，微调规则。
四、Nginx 源站兜底配置（生产可用）
# 静态资源统一缓存策略
location ~* \.(jpg|png|jpeg|gif|css|js|woff2|mp4|apk)$ {
expires 7d;
add_header Cache-Control "public";
}
# 动态接口彻底禁止缓存
location ~ ^/(api|login|order|pay|user)/ {
expires 0;
add_header Cache-Control "no-cache,no-store,must-revalidate";
}⚠️踩坑重点： 源站配置仅做兜底！真正的动静拆分必须在 CDN 边缘执行，否则大量静态请求依旧穿透回源。
五、主流 CDN 动静分离能力对比（真实场景适配）
| 对比维度 | 360CDN | Cloudflare | 传统公有云 CDN | 适用场景 |
|---|---|---|---|---|
| 精细化路径拆分规则 | 支持目录 / 后缀 / 正则多规则 | 免费版规则简单 | 规则繁琐、层级少 | 复杂多路径出海站点 |
| 静态资源出海缓存调优 | 跨境专项优化 | 通用策略无区分 | 适配国内场景 | 东南亚、拉美弱网用户多 |
| 动态接口防缓存错乱 | 强制实时回源、防穿透 | 企业版精细管控 | 容易出现缓存残留 | 电商、交易、实时数据业务 |
| 差异化回源参数 | 动静分开超时与重试 | 统一参数为主 | 参数固化不可调 | 跨洋链路波动大的业务 |
| 上手运维成本 | 可视化一键配置 | 高阶功能付费 | 配置层级深、难排查 | 中小出海运维团队 |
六、落地最佳实践（真实运维总结）
- 不要全站统一缓存，是出海性能差的头号原因；
- 动态接口宁可无缓存，绝对不能错缓存；
- 静态资源尽量最大化缓存，减少跨洋回源；
- 每次更新前端资源，务必刷新对应静态缓存；
- 新站点上线，优先做动静分离，再做其他优化。
FAQ 常见问题
Q：动静分离之后，页面更新会不会不及时？ A：不会。动态实时数据完全实时，静态资源配合版本号 + 缓存刷新，不会出现旧页面滞留。
Q：小站点流量不大，有必要做动静分离吗？ A：非常有必要。小站点资源混杂更容易卡顿，拆分后首屏速度提升非常明显。
Q：动静分离主要提速原理是什么？ A：静态就近、动态实时、资源解耦，避免动态接口阻塞整个页面加载。