JS，CSS 版本缓存控制， 离线WEB应用（PWA很多不兼容， 遂用Application Cache实现离线缓存）
js，css等静态资源缓存可以在代码里面控制，但是鉴于目前一系列生态来说，早已不是原生js， jQuery直接使用的时候了， 所以本地缓存并不推荐， 因为改动比较多。
然后就是HTTP缓存了， 我们用Expires和Cache-Control, 服务器那边直接控制到max， 就是永久缓存到本地。然后更新的话依靠hash值， 这时候框架基本都已经自动生成好了。
所以后台修改下就可以，附上nginx代码
这时候我们可以看到不管我们怎么刷新， 都不会请求服务器资源，直接读取本地资源。但是我们网络一关闭就无法访问了。
这时候用离线缓存，这里用应用缓存。
应用缓存已经标准废弃了， 新的方案https://developer.mozilla.org/zh-CN/docs/Web/API/Service_Worker_API/Using_Service_Workers
但是不影响我们使用它， 因为主流浏览器都支持。
需要先在html根节点选择appcache清单，假设取这个名字， 我文件就是这样叫的~~
html manifest="cache.appcache"
然后在js选择更新
// CACHE MANIFEST
window.applicationCache.addEventListener('updateready', function () {
if(window.applicationCache.status === window.applicationCache.UPDATEREADY) {
window.applicationCache.swapCache();
window.location.reload();
}
})
然后服务端填写cache.appcache
vi cache.appcache
CACHE MANIFEST
#v: 1.0.0
CACHE:
index.html
NETWORK:
*
然后上传代码， 前端部分完成了。
(把appcache也上传)
这时候去nginx编辑mime.types， 因为manifest的Content-Type必须是text/cache-manifest
(不用nginx的绕过)，添加一条
text/cache-manifest appcache
重启 nginx -s stop & nginx
刷新看一下。
关闭网络也可以打开，跟app一样。
以后更新版本，也需要同步下版本，这样就可以触发上面的js代码了。
Tips:
1.这样就只在有需要的时候才去加载，而不是每一次点击的时候都加载，就跟app只有在更新版本的时候才去下载app包一样
2.做的更鬼畜的就是也控制api，简单点就控制速度，但是这基本没啥用，就跟一般设置缓存只设置几小时几天， 丢，压根没用....， 之前我搞过一个xyios.js可以做到这点，成本小， 好的做法应该是，比如商品属性修改了，这时候才更新api接口。
3.加载DOM时间其实也不能小视，我网站100ms就加载完成了， 但是700ms才dom渲染完成，开始请求api~~
参考链接
http://mysy.vip
--END--
