博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
h5 离线缓存小demo
阅读量:5818 次
发布时间:2019-06-18

本文共 813 字,大约阅读时间需要 2 分钟。

传统的web应用是在线应用,这其实也是web的特色,对于PC时代问题并不大,但到了移动互联网时代,设备终端位置不再固定,依赖无线信号,网络的可靠性变得更低。比如:在火车上,穿山越岭进隧道,便无法访问web应用......

离线缓存为应用带来三个优势:
离线浏览 - 用户可在应用离线时使用它们
速度 - 已缓存资源加载得更快
减少服务器压力 - 浏览器将只从服务器下载更新过或更改过的资源
*支持性检测

实现离线缓存的步骤:

1, 建立.manifest或者appcache为后缀的文件。

 manifest文件结构:

 CACHE MANIFEST(必须)
 # 第一行必须为CACHE MANIFEST
 CACHE:(必须)
# 在此标题下列出的文件将在首次下载后进行缓存
NETWORK:(可选)
# 在此标题下列出的文件需要与服务器连接,不会被缓存
#加载文件或图片的地址(必须)
# 在此标题下列出的文件规定当页面无法访问时的回退页

2建立一个index.html 将文件引入html里面

3在服务器上面打开

4拔掉网线刷新页面图片还在(没有离线缓存的话没网了直接ng了小七认为这妹子还是很养眼的)

 

h5离线缓存缺陷

1、含有manifest属性的当前请求页无论如何都会被缓存
2、更新需要建立在manifest文件的更新,文件更新后是需要页面再次刷新的(需要2次刷新才能获取新资源)
3、更新是全局性的,无法单独更新某个文件(无法单点更新)
4、对于链接的参数变化是敏感的,任何一个参数的修改都会被(master)重新缓存(重复缓存含参页面)index.html和index.html?renew=1都会被认为是不同文件,分别缓存
试用场景

1、单地址的页面

2、对实时性要求不高的业务
3、离线webapp

 

转载于:https://www.cnblogs.com/MagicZhao123/p/6021181.html

你可能感兴趣的文章
盘点那些Vs中常用到的Tab快捷编码
查看>>
Leetcode Valid Anagram
查看>>
js的时间戳的转换
查看>>
软件测试作业3
查看>>
【五】对象的创建
查看>>
dataframe去重 drop_duplicates
查看>>
vs2008环境下pthread程序的编译运行——以多线程求π为例
查看>>
编程之美 2.8找到合适的数字
查看>>
多线程
查看>>
Java精选笔记_DBUtils工具
查看>>
day16<集合框架+>
查看>>
mybatis由浅入深day01_8输出映射_8.1resultType输出类型(8.1.1输出简单类型_8.1.2输出pojo对象和pojo列表_8.1.3输出hashmap)...
查看>>
away3d 4.1 导入模型规范方法,解决模型导入错误
查看>>
Java正则过滤
查看>>
composer在ubuntu下安装
查看>>
[SinGuLaRiTy] 2017-07-26 综合性测试
查看>>
Android开发技巧——去掉TextView中autolink的下划线
查看>>
spring 入门
查看>>
leetcode445
查看>>
JAVA RPC (七) 手把手从零教你写一个生产级RPC之client请求
查看>>