[FE] 静态资源的部署方案

(1)无缓存部署

index.html


foo

a.css

.foo{
    color:red;
}

问题:浪费带宽

(2)304协商缓存

问题:还是要和服务器通信一次

(3)强制本地缓存

cache-control/expires,不要和服务器通信
问题:无法更新资源

(4)通过更新资源的查询参数,更新缓存

index.html


foo

问题:没有改变的资源也要同时更新
index.html




(5)用数据摘要算法设置查询参数值

index.html




问题:包含静态资源的CDN节点,部署顺序问题
index.html


a.css

.foo{
    color:red;
}

先部署index.html,
则访问者会请求并缓存旧的a.css,页面错乱,再部署a.css也没有用了

先部署a.css,
有缓存的访问者页面不变,等部署了新index.html,统一更新
没有缓存的访问者会用旧页面加载新样式表,样式错乱,再部署新index.html,恢复正常

(6)采用非覆盖式发布

用数据摘要算法命名文件,新建一个更新的文件。
旧的资源a_0abc23.css,新的资源a_f02bc2.css

部署时,先上传新的资源a_f02bc2.css,再覆盖index.html

问题:该资源被其他资源引用的地址都得相应调整。

你可能感兴趣的:([FE] 静态资源的部署方案)