记离线缓存(manifest)一大坑,断定其只适用于静态网站或离线应用
今天看了离线缓存(manifest)方面的资料,兴冲冲地就想给自己的网站用上。待我把代码都写好部署上服务器,并测试过OK的时候,在SegmentFault刷了一把manifest方面的问答,才发现这个大坑:manifest除了缓存manifest.appcache文件所指定的资源外,还必定会缓存当前的html页面。
具体来说:
当用户第一次访问页面,会从服务器上拉取html页面,以及其它静态资源。
浏览器会把html页面,连同
manifest.appcache文件,连同manifest.appcache文件里所指定的静态资源一并存入Application Cache。当用户第二次访问该页面,
manifest.appcache文件里所指定的静态资源就不需要重新加载了,直接从cache读出。这很好,问题是,当前的html页面也从cache直接读出来了,根本就不管线上的版本呀!这造成的问题是,网站如果更新了,用户的浏览器根本不知道,还显示cache里的版本。
网上有所谓的利用<iframe>的方案,但由于年代久远,已不适用于当前的浏览器了。
冷静下来想想,这到底是不是个Bug呢?我认为不是,正如manifest的中文译名——离线缓存,这个功能根本就是设计给离线应用(例如Hybrid App)的:用navagator.online来判断当前用户是否联网,如果离线则任由浏览器/WebView读取缓存,如果在线则清空缓存后刷新页面让浏览器/WebView读取线上最新版本的代码。
另外,采取静态化策略的网站,也很适合采用manifest,因为静态化后的网站实际上就已经属于静态网站了,让浏览器读缓存可比从服务器读静态html还省性能。而如果网站需要更新的时候,在重新做完静态化(重新生成静态html文件)后,更改一下manifest的版本号,就可以刷新缓存了,运维成本也不高。
记离线缓存(manifest)一大坑,断定其只适用于静态网站或离线应用的更多相关文章
- 离线缓存 manifest
程序的离线缓存由一个叫做manifest的文本文件控制,把需要离线缓存的文件列在里面即可,这个列表还可以控制需要缓存的情况,甚至当用户从缓存地址进入到没有缓存的地址应该显示什么 当浏览器下载解析了ma ...
- HTML5 离线缓存manifest
1.简介W3C官方对manifest的介绍是HTML5 引入了应用程序缓存,这意味着 web 应用可进行缓存,并可在没有因特网连接时进行访问. 应用程序缓存为应用带来三个优势: 离线浏览 - 用户可在 ...
- HTML5离线缓存Manifest
web app不比PC,有性能和流量方面的考虑,离线应用越来越重要,虽然浏览器有缓存机制,但是时常不靠谱,更何况普通情况下html文件是没法缓存的,断网之后一切over. 什么是manifest? 简 ...
- HTML5 离线缓存Appcache
创建一个和html同名的manifest文件,比如页面为index.html,那么可以建一个index.manifest的文件,然后给index.html的html标签添加如下属性即可: <ht ...
- html5离线缓存使用
html5 离线缓存使用以及注意事项 1.index.html中加入离线缓存的声明文件 如:<!DOCTYPE html><html manifest="test.appc ...
- iOS数据库离线缓存思路和网络层封装
一直想总结一下关于iOS的离线数据缓存的方面的问题,然后近期也简单的对AFN进行了再次封装.全部想把这两个结合起来写一下.数据展示型的页面做离线缓存能够有更好的用户体验,用户在离线环境下仍然能够获取一 ...
- HTML5 manifest离线缓存
一.基本概念 离线缓存是HTML5新引入的技术,能够让你的Web应用程序指定哪些文件可以缓存在本地,使得你的网络断开时依然可以通过本地的缓存来进行访问浏览. 二.使用方法 1. MIME type 声 ...
- H5离线缓存机制-manifest
简介:Manifest 其实就是web应用的一种缓存机制,主要用于现在webapp应用中,它是浏览器自己的一种机制,随着移动互联网时代的到来,网络可靠性降低,如果我们已经将需要的文件缓存下下来,一旦网 ...
- html5 manifest 离线缓存知识点
1.最大缓存容量为 5M. 2.manifest文件需要配置正确的MIME-type,即“text/cache-manifest”,这个是在web服务器上进行配置. ②编写.manifest文件,文件 ...
随机推荐
- ScrollView垂直滚动和HrizontalScrollView水平滚动
当我们在写一个页面,内容过多时我们需要滚动页面来查看,但是注意ScrollView下只能有一个元素,所以要把主页面改下,这样就只有一个LinearLayout元素: 1 <ScrollView ...
- c语言刷 设计题合计
355. 设计推特 #define MAX_LEN 512 struct User { int userId; int followee[MAX_LEN]; // 散列表,0/1,1表示这个user被 ...
- 初识html及网络爬虫概念
网络爬虫 HTML超文本标记语言 HTTP协议 简单的网络请求 python模块模拟浏览器发送请求 爬虫小案例 爬虫简介 我们一般情况 都是通过浏览器正常访问服务端获取资源浏览器展示给用户看 爬虫 模 ...
- Python字典的创建与复制
Python 字典练习题 1.字典的创建 1.1 普通创建 d={'name':'Allen','age':21,'gender':'male'} print(d) # {'name': 'Allen ...
- Flask 自建扩展
自建扩展介绍 Flask扩展分两类 纯功能, 如: Flask-Login 提供用户认证 对已有的库和工具包装(简化继承操作,并提供有用的功能,更方便) 如: Flask-SQLAlchemy 包装了 ...
- csrf跨站请求、相关装饰器、auth模块使用
昨日内容回顾 django操作cookie和session # 作用:就是保存用户信息,保存一系列数据,还可以做缓存 保留一段时间 # session是基于cookie工作的 1. 数据是保存在服务端 ...
- larav jq ajax 登录
//自高自测登录8.10 Route::get('name/login','nameLoginController@login'); Route::post('/name/logins','nameL ...
- CSAPP shell Lab 详细解答
Shell Lab的任务为实现一个带有作业控制的简单Shell,需要对异常控制流特别是信号有比较好的理解才能完成.需要详细阅读CS:APP第八章异常控制流并理解所有例程. Slides下载:https ...
- 在数据结构与算法中 传值方式(C语言)
传值方式 前言 当初学顺序链表的时候,书上就出现了这样的语言,如下所示: Status InitList_Sq(SqList &L) { //构造一个空的线性表L. L.elem = (Ele ...
- Java基础——类与接口
一.类与接口的关系 1.类与类的关系 继承关系,只能单继承,不能多继承:但是可以多层继承 2.类与接口的关系 实现关系,可以单实现,也可以多实现,还可以继承一个类的同时实现多个接口 3.接口与接口的关 ...