- 存放静态资源文件到服务器 但这种形式在性能上也有缺陷:
- 受地理环境影响,离服务器越远资源加载越慢
- 频繁请求资源对服务器压力较大
- 存放静态资源文件到CDN为了进一步提升性能,可以把动态网页(index.html)和静态资源(js、css、image...)分开部署。静态资源被放置于CDN上. 但是CDN也有缓存策略:新的静态资源发布后,需要一定的时间去覆盖各个边缘站点的旧资源。若某客户端获得了新的动态网页,但是附近的 CDN节点尚未更新最近发布的静态资源,客户端即便放弃本地缓存,它加载的依旧是位于CDN上的“脏数据”。怎么办呢?干脆把文件名也给改了——让摘要信息成为文件名的一部分!
具体实现可以仰仗webpack,将output.filename设为[name].[contenthash].js,输出文件和 html 模版都会帮你更改好. 用摘要信息重命名后的资源文件,与旧资源就不同名了,不再需要以覆盖旧文件的形式主动更新各个地区的边缘站点。
新版本发布后,浏览器首次请求资源,若CDN不存在该资源,便会向就近的边缘站点加载该文件,同时更新 CDN 缓存;这就彻底避免了CDN脏数据的问题.