html5 manifest 离线缓存知识点
1.最大缓存容量为 5M.
2.manifest文件需要配置正确的MIME-type,即“text/cache-manifest”,这个是在web服务器上进行配置。
②编写.manifest文件,文件名可自定义,例如hahaha.manifest CACHE MANIFEST(声明头部文件,必须大写) CACHE:(这里写需要缓存的文件,例如js、css、img) js/index.js css/index.css img/aaa.jpg NETWORK(需要网络调用的文件,大写) * FALLBACK (在此标题下,列出的文件规定页面无法访问的回退页面) 404.xml
③编写HTML文件(.manifest文件和HTML页面同级) <!doctype html> <html manifest="hahaha.manifest">(html标签里写入你的.manifest文件) ... <script>(script标签里需要添加版本更新的监听) applicationCache.addEventListener("updateready",function(e){ if(applicationCache.status==applicationCache.UPDATEREADY){
applicationCache.swapCache();//使用新版本资源
window.location.reload();//刷新页面
}
},false);
</script> ...
3.控制台里可以找到离线缓存的文件
二,离线缓存的有点
1.减少服务器的负载,提高资源加载速率。
2.离线浏览,方便用户在离线时使用。
缺点:
1.更新完版本后,必须刷新一次才会启动新版本。
2.进入离线存储的页面,如果不更新版本,会将其当做静态页面不请求。
3.无法进行灰度发布(即一部分人使用旧版本,一部分人使用新版本)。
4.无法增量更新
三,传统浏览器缓存的区别
1.离线缓存是针对整个应用,浏览器缓存是单个文件。
2.离线缓存断网还可以打开页面,浏览器缓存不行。
3.离线缓存可以主动通知浏览器更新资源。
html5 manifest 离线缓存知识点的更多相关文章
- HTML5 manifest离线缓存
一.基本概念 离线缓存是HTML5新引入的技术,能够让你的Web应用程序指定哪些文件可以缓存在本地,使得你的网络断开时依然可以通过本地的缓存来进行访问浏览. 二.使用方法 1. MIME type 声 ...
- HTML5 manifest离线缓存技术
干什么用的? 离线缓存为的是第一次请求后,根据manifest文件进行本地缓存,并且在下一次请求后进行展示(若有缓存的话,无需再次进行请求而是直接调用缓存),最根本的感觉是它使得WEB从online可 ...
- 使用html5的离线缓存技术
突然想用html5的离线缓存,但是一直没有成功,在各种群里问发现很多人都没什么经验,最终终于在各种论坛找到解决方案了.下面就简单记录一下相关情况. 一.离线缓存的优点 我们都知道离线缓存主要是用来减少 ...
- html5的离线缓存
一个离线网络应用程序就是一个URL的列表,html,css,js,图片,或者其他类型的资源. 把这些资源,在本地缓存下来,当你尝试在没有网络连接时访问网络应用程序,你的浏览器将自动切换并使用本地代替. ...
- H5 manifest离线缓存
请跳转我的有道云笔记查看: http://note.youdao.com/noteshare?id=caaf067c6e38820ba8f87b212c2327a9&sub=23E0F8F7A ...
- node.js与HTML5离线缓存
最近正学到HTML5的离线缓存,却看到需要配置服务器.一下子就懵了,毕竟服务器的有关配置一般是很复杂的,而node.js的服务器是自己的代码生成的,这下要怎么配置?在网上搜索了很久,都没用关于node ...
- HTML5离线缓存(Application Cache)
HTML5离线缓存又名Application Cache,是从浏览器的缓存中分出来的一块缓存区,要想在这个缓存中保存数据,可以使用一个描述文件(manifest file),列出要下载和缓存的资源. ...
- HTML5离线缓存问题
HTML5离线缓存问题 1.应用程序缓存 什么是应用程序缓存(Application Cache)? HTML5 引入了应用程序缓存,这意味着 web 应用可进行缓存,并可在没有因特网连接时进行访问. ...
- HTML5离线缓存
参考文档:http://www.w3cschool.cc/html/html5-app-cache.html HTML5 应用程序缓存 又称离线缓存 ,即使断线了,刷新后也还是缓存了原来的页面,不会4 ...
随机推荐
- null类型
null类型只有一个特殊的值null null值表示一个空对象指针. var car = null; alert(typeof null);//object undefined派生自null ...
- Django之ContentType详解
contenttypes 是Django内置的一个应用,可以追踪项目中所有app和model的对应关系,并记录在ContentType表中. models.py文件的表结构写好后,通过makemigr ...
- Timer应用之Interval优化
开发中, 有时有这种场景,使用 Timer 的 Timer_Elapsed 间隔 执行(如:从数据库)获取数据 与 现有 应用服务器中的 静态变量数据(起到缓存的目的)做 对比 ,若有改变,则 更新 ...
- Mongodb之主从复制
本次在同一台主机启动两个端口进行配置 在文件夹/etc/mongod下面新建两个配置文件 一个主配置文件一个从配置文件 master.conf dbpath=/data/mongo-master lo ...
- java后台设计简单的json数据接口,设置可跨域访问,前端ajax获取json数据
在开发的过程中,有时候我们需要设计一个数据接口.有时候呢,数据接口和Web服务器又不在一起,所以就有跨域访问的问题. 第一步:简单的设计一个数据接口. 数据接口,听起来高大上,其实呢就是一个简单的Se ...
- 在ubuntu下安装使用latex
参考:https://www.cnblogs.com/longdouhzt/archive/2012/09/27/2706358.html https://jingyan.baidu.com/albu ...
- 【转】(翻译)从底层了解ASP.NET体系结构
原文地址:http://www.cnblogs.com/rijing2004/archive/2007/09/14/howaspnetwork.html 前言关于ASP.NET的底层的工作机制,最近园 ...
- Java中String, StringBuilder和StringBuffer
Java中常用来处理字符串的类有三个: String, StringBuffer和StringBuilder. 区别 三者都继承自CharSequence接口, 首先说明三者间主要区别 String字 ...
- 深入了解oracle存储过程的优缺点
定义: 存储过程(Stored Procedure )是一组为了完成特定功能的SQL 语句集,经编译后存储在数据库中.用户通过指定存储过程的名字并给出参数(如果该存储过程带有参数)来执行它.存储过程是 ...
- SQLSERVER数据导入到MYSQL
SQLSERVER数据导入到MYSQL http://hi.baidu.com/luck001221/item/cb4462299f9ea79ab73263d2?qq-pf-to=pcqq.group ...