zoukankan      html  css  js  c++  java
  • 应用程序缓存--manifest

    应用程序缓存(Application Cache)为应用带来三个优势:

    • 离线浏览 - 用户可在应用离线时使用它们
    • 速度 - 已缓存资源加载得更快
    • 减少服务器负载 - 浏览器将只从服务器下载更新过或更改过的资源。

    manifest文件的位置在html标签中,

        <!DOCTYPE html>
        <html manifest="index.manifest">
    
        </html>
    

    manifest 文件是简单的文本文件,它告知浏览器被缓存的内容(以及不缓存的内容)。

    manifest 文件可分为三个部分:

    • CACHE MANIFEST - 在此标题下列出的文件将在首次下载后进行缓存
    • NETWORK - 在此标题下列出的文件需要与服务器的连接,且不会被缓存
    • FALLBACK - 在此标题下列出的文件规定当页面无法访问时的回退页面(比如 404 页面)

    下面这个例子:

        CACHE MANIFEST
        #update at Fri Jun 17 2016 20:02:37 GMT+0800 (CST)
    
        NETWORK:
        *
        # *表示通配符,#表注释
        CACHE:
        build/lib.js
        style.css
        build/app.js    
    
        FALLBACK:
        /html 404.html
        #访问路径 文件
    

    manifest 文件的写入可由gulp等(利用node.js的fs模块)在打包的时候写入

        var fs = require('fs');
        var workDir = 'demo';  //目录
        var cacheFiles = ['build/lib.js', 'build/app.js']; //要缓存的文件其实除了指定,还可以从index.html文件中去匹配src、href
        var cacheConArr = ['CACHE MANIFEST','#update at '+new Date(),'','NETWORK:','*','','CACHE:'].concat(cacheFiles).concat(['FALLBACK:','/html 404.html']);
        fs.writeFileSync(workDir+'index.manifest',cacheConArr.join('
    '));
    

    在首次下载manifest 文件中的缓存,可看到这个

    更新缓存

    • 用户清空浏览器缓存
    • manifest文件被修改
    • 由程序来更新应用缓存
        window.applicationCache.onupdateready = function(){
            location.reload();
        }   
    
  • 相关阅读:
    oracle数据库迁移---windows环境下
    Tomcat内存溢出(java.lang.OutOfMemoryError: PermGen space)
    64位win系统上面tomcat6启动不了 window不能再本地计算机启动
    linux学习之一些琐碎知识点
    mysql备份与还原
    linux学习中遇到的各种故障与解决方法
    Jmeter调试工具---Debug Sampler
    python+requests接口自动化测试框架实例详解教程
    互联网架构的演变
    面试时如何考察应聘者的素质?
  • 原文地址:https://www.cnblogs.com/lyre/p/5606014.html
Copyright © 2011-2022 走看看