HTML+CSS入门如何高效部署前端代码-职坐标

HTML+CSS入门如何高效部署前端代码

沉沙 2018-09-18 来源：阅读 1186 评论 0

摘要：本篇教程介绍了HTML+CSS入门如何高效部署前端代码，希望阅读本篇文章以后大家有所收获，帮助大家HTML+CSS入门。

本篇教程介绍了HTML+CSS入门如何高效部署前端代码，希望阅读本篇文章以后大家有所收获，帮助大家HTML+CSS入门。

1.利用浏览器的304缓存，但是304叫协商缓存，还是需要与服务器通信一次
2.强制使用浏览器使用本地缓存（cache-control/expires），但是问题来了，不让浏览器发资源请求，资源怎么更新。
3.使用版本号，类似于a.css?v=1.0，b.css?v=1.0，做了更改的时候都变成a.css?v=2.0，b.css?v=2.0，有时候a.css改变了，b.css没有改变，不是多此一举吗？
4.使用数据摘要算法，类似于a.css?v=0abc23，b.css?v=65ao1j，如果a.css做了更改的话，a.css=v=1asd2j，b.css还是b.css?v=65ao1j。
5.很多企业，现在都静态文件cdn部署了，类似于//static.cdn.com/css/a.css?v=0abc23，与页面分开部署了，
　　a.如果先部署页面，再部署资源：在二者部署的时间间隔内，如果有用户访问页面，就会在新的页面结构中加载旧的资源，并且把这个旧版本的资源当做新版本缓存起来，其结果就是：用户访问到了一个样式错乱的页面，除非手动刷新，否则在资源缓存过期之前，页面会一直执行错误。
　　b.如果先部署资源，再部署页面：
在部署时间间隔之内，有旧版本资源本地缓存的用户访问网站，由于请求的页面是旧版本的，资源引用没有改变，浏览器将直接使用本地缓存，这种情况下页面展现正常；但没有本地缓存或者缓存过期的用户访问网站，就会出现旧版本页面加载新版本资源的情况，导致页面执行错误，但当页面完成部署，这部分用户再次访问页面又会恢复正常了。
解决方法：改变命名方式，改成a_0abc23.css，上线的时候先部署静态资源，再部署页面。

本文由职坐标整理发布，欢迎关注职坐标WEB前端HTML/CSS频道，获取更多HTML/CSS知识！

html与css入门经典 htmlcss入门教程 htmlcss教程按时

本文由 @沉沙发布于职坐标。未经许可，禁止转载。