参考文章:http://mp.weixin.qq.com/s?__biz=MTEwNTM0ODI0MQ==&mid=404724239&idx=1&sn=e0a2887f9ff6293f0f550fa4e44057a0&scene=1&srcid=0331jLkF55dKeJO00POMiXLZ

1.浏览器缓存机制

2.Dom Storage(local storage 和 session storage)

3.Web SQL Database,不推荐使用。

根据官方的标准文档,Web SQL Database存储机制不再推荐使用,将来也不再维护,而是推荐使用AppCache和IndexedDB。

4.Application Cache(manifest)

AppCache的缓存文件,与浏览器的缓存文件分开存储的,还是一份?应该是分开的。因为AppCache在本地也有5MB(分HOST)的空间限制。

AppCache在首次加载生成后,也有更新机制。被缓存的文件如果要更新,需要更新manifest文件。因为浏览器在下次加载时,除了会默认使用缓存外,还会在后台检查manifest文件有没有修改(byte   by byte)。发现有修改,就会重新获取manifest文件,对Section:CACHE MANIFEST下文件列表检查更新。manifest文件与缓存文件的检查更新也遵守浏览器缓存机制。

如用用户手动清了AppCache缓存,下次加载时,浏览器会重新生成缓存,也可算是一种缓存的更新。另外, Web App也可用代码实现缓存更新。

分析:AppCache看起来是一种比较好的缓存方法,除了缓存静态资源文件外,也适合构建Web离线App。在实际使用中有些需要注意的地方,有一些可以说是”坑“。

  1. 要更新缓存的文件,需要更新包含它的manifest文件,那怕只加一个空格。常用的方法,是修改manifest文件注释中的版本号。如:# 2012-02-21 v1.0.0

  2. 被缓存的文件,浏览器是先使用,再通过检查manifest文件是否有更新来更新缓存文件。这样缓存文件可能用的不是最新的版本。

  3. 在更新缓存过程中,如果有一个文件更新失败,则整个更新会失败。

  4. manifest和引用它的HTML要在相同HOST。

  5. manifest文件中的文件列表,如果是相对路径,则是相对manifest文件的相对路径。

  6. manifest也有可能更新出错,导致缓存文件更新失败。

  7. 没有缓存的资源在已经缓存的HTML中不能加载,即使有网络。例如:http://appcache-demo.s3-website-us-east-1.amazonaws.com/without-network/

  8. manifest文件本身不能被缓存,且manifest文件的更新使用的是浏览器缓存机制。所以manifest文件的Cache-Control缓存时间不能设置太长。

另外,根据官方文档,AppCache已经不推荐使用了,标准也不会再支持。现在主流的浏览器都是还支持AppCache的,以后就不太确定了。

在Android内嵌Webview中,需要通过Webview设置接口启用AppCache,同时还要设置缓存文件的存储路径,另外还可以设置缓存的空间大小。

5.Indexed Database

6.File System API

H5缓存机制学习记录的更多相关文章

  1. H5 缓存机制浅析 移动端 Web 加载性能优化

    腾讯Bugly特约作者:贺辉超 1 H5 缓存机制介绍 H5,即 HTML5,是新一代的 HTML 标准,加入很多新的特性.离线存储(也可称为缓存机制)是其中一个非常重要的特性.H5 引入的离线存储, ...

  2. Linux 系统缓存机制学习

    前言:本文为参考他人的文章,是一篇学习记录型博客.理解linux的系统缓存机制有助于理解elasticsearch实时更新的原理. 一.缓存机制 为了提高文件系统性能,内核利用一部分物理内存分配出缓冲 ...

  3. H5 缓存机制解析

    在web项目开发中,我们可能都曾碰到过这样一个棘手的问题: 线上项目需要更新一个有问题的资源(可能是图片,js,css,json数据等),这个资源已经发布了很长一段时间,为什么页面在浏览器里打开还是没 ...

  4. JPA,EclipseLink 缓存机制学习(一) 树节点搜索问题引发的思考

    最近在项目在使用JPA+EclipseLink 的方式进行开发,其中EclipseLink使用版本为2.5.1.遇到一些缓存方面使用不当造成的问题,从本篇开始逐步学习EclipseLink的缓存机制. ...

  5. JPA,EclipseLink 缓存机制学习——树节点搜索问题引发的思考

    最近在项目在使用JPA+EclipseLink 的方式进行开发,其中EclipseLink使用版本为2.5.1.遇到一些缓存方面使用不当造成的问题,从本篇开始逐步学习EclipseLink的缓存机制. ...

  6. 利用H5缓存机制实现点击按钮第一次与之后再点击分别跳转不同页面

    昨天碰到这样一个需求,要求点击按钮第一次跳转到a页面,之后再点击它就跳转到b页面.这个问题我首先就想到了利用H5的缓存sessionstorage来实现,SessionStorage用于本地存储一个会 ...

  7. H5+ and mui学习记录

    基础 1.H5+ 定义实现了一些调用原生方法的对象 2.其他的原生方法可以通过Native.js调用 webview 3.webview是调用原生界面的H5+对象 4.单个webview只承载单个页面 ...

  8. RecyclerView 缓存机制学习笔记2

    RecyclerView 初始化所有的视图后,调用 去缓存(StaggeredGridLayoutManager), 而不是初始化一次缓存一次 存储后系统又会去调用tryGetViewHolderFo ...

  9. RecyclerView 缓存机制学习笔记1

    盗用别人图片 获取VIew的方法的流程 最先调用 其次调用 这个方法调用会先去缓存 这个是是否有动画,有动画就去里面取. 如果取不到就接着调用 如果在没有继续调用 都取不到就去实例化 调用的次数取决于 ...

随机推荐

  1. XWW的难题(bzoj 3698)

    Description XWW是个影响力很大的人,他有很多的追随者.这些追随者都想要加入XWW教成为XWW的教徒.但是这并不容易,需要通过XWW的考核.XWW给你出了这么一个难题:XWW给你一个N*N ...

  2. Codevs 1085 数字游戏

    1085 数字游戏 2003年NOIP全国联赛普及组 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 黄金 Gold 题目描述 Description 丁丁最近沉迷于一个数字游戏之中 ...

  3. bugs view:

    Expecially those business bugs! I should check better especially when data changes! This place requi ...

  4. android中提示&对话框----Notification

    Notification(状态栏通知) 一.Notification用于状态栏显示通知的控件,在不同的设备上面Notification是不一样的 二.Notification的基本布局 元素组成: I ...

  5. UVALive 6514:Crusher’s Code(概率dp)

    题目链接 https://icpcarchive.ecs.baylor.edu/external/65/6514.pdf 题意:给出n个数(n<8) 求这n个数分别两个程序排成有序时,程序的期望 ...

  6. JS和jquery加载的区别

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  7. javascript 动态添加城市

    匿名函数的使用 createTextnode 创建文本 createElement   创建元素 appendChild     将文本或元素追加 <!DOCTYPE html> < ...

  8. springBoot api接口

    application/json 请求接口 @RequestMapping(value = "/getBaseData", method = RequestMethod.POST, ...

  9. BZOJ 3672 NOI 2014 购票

    题面 Description 今年夏天,NOI在SZ市迎来了她30周岁的生日.来自全国 n 个城市的OIer们都会从各地出发,到SZ市参加这次盛会. 全国的城市构成了一棵以SZ市为根的有根树,每个城市 ...

  10. CMake的应用(在vision studio2008中去掉 ALL_BUILD 和 ZERO_CHECK)

    from  http://blog.csdn.net/jtop0/article/details/6167432 一般由CMake是 跨平台软件开发和维护过程的 工程构建工具.“在每个系统构建你的工程 ...