zoukankan      html  css  js  c++  java
  • h5 离线缓存小demo

    传统的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

  • 相关阅读:
    MEP工作流程
    一盘很大的棋
    老人棒子鸡
    REVIT多专业协同设计
    不做没有理想的咸鱼
    卫生间排风设计规范
    如何时刻保持在目标的正确轨道上
    OGame殖民
    OGame舰队保护(FleetSave, FS)
    在局域网内架ESS3.0升级服务器
  • 原文地址:https://www.cnblogs.com/MagicZhao123/p/6021181.html
Copyright © 2011-2022 走看看