html5新增了离线缓存机制这说法对吗

html5新增了离线缓存机制这说法对吗,第1张

这个不算是 新增吧。

随着现代浏览器的推动,Flash放弃对移动端的支持,HTML5无疑成为当前Web前端炙手可热的话题。各大游戏开发商、App开发商纷纷投入人力进行研究和技术储备。相信不久的将来,HTML5会迎来一个快速发展和普及的春天。那么,HTML5这个新一代的标准,又给我们带来哪些缓存机制呢?

HTML5 之离线应用Manifest

我们知道,使用传统的技术,就算是对站点的资源都实施了比较好的缓存策略,但是在断网的情况下,是无法访问的,因为入口的HTML页面我们一般运维的考虑,不会对其进行缓存。HTML5的Cache Mainifest离线应用特性就能够帮助我们构建离线也能使用的站点,所有的资源都使用浏览器本地缓存,当然前提是要求在联网的情形下使用过一次站点。

如何实现离线访问特性

实现的步骤非常简单,主要3个步骤:

1)在服务器上添加MIME TYPE支,让服务器能够识别manifest后缀的文件

AddType text/cache-manifest manifest

2)创建一个后缀名为.manifest的文件,把需要缓存的文件按格式写在里面,并用注释行标注版本

CACHE MANIFEST

# 直接缓存的文件

CACHE:

Path/to/cache.js

# version:2012-03-20

3)给 <html>标签加 manifest 属性,并引用manifest文件

具体可以参考:HTML5 缓存: cache manifest

<html manifest=”path/to/name-of.manifest”>

离线应用访问及更新流程

第一次访问离线应用的入口页HTML(引用了manifest文件),正常发送请求,获取manifest文件并在本地缓存,陆续拉取manifest中的需要缓存的文件

再次访问时,无法在线离线与否,都会直接从缓存中获取入口页HTML和其他缓存的文件进行展示。如果此时在线,浏览器会发送请求到服务器请求manifest文件,并与第一次访问的副本进行比对,如果发现版本不一致,会陆续发送请求重新拉取入口文件HTML和需要缓存的文件并更新本地缓存副本

之后的访问重复第2步的行为

离线机制的缓存用途

从Manifest的机制来看,即使我们不是为了创建离线应用,也同样可以使用这种机制用于缓存文件,可以说是给Web缓存提供多一种可以选择的途径。

存在的问题:缓存文件更新控制不灵活

就目前HTML5提供的manifest机制来讲,一个页面只能引用一个manifest页面,而且一旦发现这个manifest改变了,就会把里面所有定义的缓存文件全部重新拉取一遍,不管实际上有没有更新,控制比较不灵活。针对这个问题,也有的同学提出了一些建议,比如把需要缓存的文件分模块切分到不同manifest中,并分开用HTML引用,再使用强大的iframe嵌入到入口页面,这样就当某一个模式需要有更新,不会导致其他模块的文件也重新拉取一遍。

HTML5 之本地存储localstorage

HTML5给我们提供本地存储localstorage特性,严格来讲,其实已经不算传统Web缓存的范畴。因为它存储的地方是跟Web缓存分开的,是浏览器重新开辟的一个地方。

localstorage的作用

本地存储localstorage的作用主要使Web页面能够通过浏览器提供的set/get接口,存储一些自定义的信息到本地硬盘,并且在单次访问或以后的访问过程中随时获取或修改。

Localstorage的使用

Localstorage提供了几个非常易用的Api,setItem/getItem/removeItem/clear,具体的可以参考:Html5 Step by Step(二) 本地存储

Localstorage的缓存用途

Localstorage设计的本意可能是用来存储一些用户 *** 作的个性化设置的文本类型的信息和数据,当我们其实也可能拿来当Web缓存区使用,比如我们可以将Base64格式编码的图片信息,存在localstorage中,再次访问时,直接本地获取后,使用Css3的Data:image的方式直接展现出来。

存在的问题:大小限制

按照目前标准,目前浏览器只给每个独立的域名提供5m的存储空间,当存储超过5m,浏览器就会d出警告框。

可以说,HTML5的Manifest和localstorage是给我们在考虑Web缓存的时候提供了多一种思路,当你开发的应用只面对现代浏览器的时候,不妨可以考虑一下

html5的localStorage用于存储一些临时的离线数据,

localStorage和file、database一样,是存储,有永久性质。

存入数据库的数据,不会在某一天突然被删除了。

保存到硬盘里面的文件,也不会再某一天突然消失了。

所以,localStorage本身没有时效性,因为storage毕竟不是ceche。

因此,只能用js手动清除了。

万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改(这是一项推荐标准、外语原文:W3C Recommendation、见本处参考资料原文内容:)。

2014年10月29日,万维网联盟宣布,经过接近8年的艰苦努力,该标准规范终于制定完成。

HTML标准自1999年12月发布的HTML4.01后,后继的HTML5和其它标准被束之高阁,为了推动Web标准化运动的发展,一些公司联合起来,成立了一个叫做 Web Hypertext Application Technology Working Group (Web超文本应用技术工作组 -WHATWG) 的组织。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/6183036.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-17
下一篇 2023-03-17

发表评论

登录后才能评论

评论列表(0条)

保存