欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

一分钟学会html5缓存之manifest文件_html/css_WEB-ITnose

程序员文章站 2022-05-26 22:34:33
...
分类:WEB前端时间: 2016年4月21日

HTML5引入了应用程序缓存(Application Cache),通过创建manifest文件可以轻松地创建Web应用的离线版本,使Web应用可以在没有网络的时候任然可以访问。manifest文件主要定义需要缓存的文件,支持manifest的浏览器将按照manifest文件的规则把文件保存在本地,这样在没有网络的时候就可以从本地读取缓存文件。下面PHP程序员雷雪松详细的讲解下HTML5缓存manifest文件。

1、Manifest的优点

a.离线浏览 – 用户可在应用离线时使用它们

b.速度 – 已缓存资源加载得更快

c.减少服务器负载 – 浏览器将只从服务器下载更新过或更改过的资源。

2、如何试用Manifest文件

a.通过html标签的manifest属性制定Manifest文件

b.Manifest文件基本格式,CACHE MANIFEST 为文件申明CACHE- 需要缓存的文件

CACHE MANIFEST CACHE #缓存theme.css和main.js /theme.css /main.js

NETWORK – 不被缓存的文件

CACHE MANIFEST NETWORK: #不缓存login.php,*表示全部 login.php

FALLBACK – 制定无法访问文件时的文件

CACHE MANIFEST FALLBACK: #当无法访问index.js时,访问main.js /index.js /main.js

3、完整的 Manifest 文件

CACHE MANIFEST # 2016-04-21 v1.0 /theme.css /main.js  NETWORK: login.php  FALLBACK: /index.js /main.js

4、如何更新缓存

a.修改manifest文件

b.通过js清除缓存,window.applicationCache.update();

c.清除浏览器缓存