出于网速的原因, 我们遇到前端代码通过 CDN 存放, 几乎是全部的代码, CSS, JS, 图片, 都是从 CDN 加载的而不是服务器本身,
问题随之而来了, 我们的 JS, CSS, 图片, 都有一部份是要频繁更改的.
结果就是每次上线发布都需要重命名 JS CSS 甚至一些图片, 形成了比较繁琐的流程. 首先自己也写了一些工具, 自动化 JS 和 CSS 重命名的步骤, 但部分问题并没有解决:
- CSS Spirites 维护的文件需要手动维护, 并且文件名因为 CDN 缓存需要更改
- 服务器需要保存多版本的 JS 和 CSS 文件, Git 仓库内容比较复杂
是否有相关工具可以对 CDN 相关的前端部署做一些优化呢?
我们是这么做的。发一次版本就加一次前端打包版本号,就算只改项目里的一个文字。项目使用的AWS的CDN(cludfront),没有清除CDN缓存功能
CSS 中用到的图片资源使用相对路径,不使用绝对路径。 我使用 Grunt 来打包,Grunt 中的打包逻辑是这样的:
有人提到担心同一个域名,过多连接数会影响加载速度。我的解决办法是,添加两个域名,一个域名负责js,一个域名负责css&images