Why offline first?

Imagin you are visiting a website, it is fine if wifi connection is good. It might be also "fine" if show you "Your don't have internet connection", so you give up. The worse case is you have really poor wifi connection and the page is trying to loading, but nothing comes up. So you just wait and wait...

Noramlly online first soultion is trying to connect network (server) first. If cannot connect then fetch data from cache. This is not so good, because you still need to wait and wait util network fallback then you will get cache data. How about we do:

  1. When page loading, send two request.
  2. One request going to cache to fetch as much as we can to display on the screen.
  3. Another reqest going to the reall server, get data update.
  4. If we are in really poor wifi connection, at least we get something, we see something, better than nothing.
  5. If the connection is good, the cache data will be replaced with real data and interface update immediately. This will provide a better user experence.

[PWA] 0. Introduce to Offline First的更多相关文章

  1. how to use panda

    0.Introduce pandas.read_csv(filepath_or_buffer,sep=', ', dialect=None, compression='infer', doublequ ...

  2. Project Server 2016 部署

    问题: 手动创建网站集后,激活Project的功能时候报错 Only Administrator users can obtain the connection string for [Admin] ...

  3. Python黑帽编程 3.2 ARP监控

    Python黑帽编程 3.2 ARP监控 在第3.1节<ARP欺骗>中,我们学习了ARP的基本原理,使用Python实现了我们自己的ARP欺骗工具.在上一节的基础上,我们来实现一个ARP监 ...

  4. Python黑客编程ARP欺骗

    Python灰帽编程 3.1 ARP欺骗 ARP欺骗是一种在局域网中常用的攻击手段,目的是让局域网中指定的(或全部)的目标机器的数据包都通过攻击者主机进行转发,是实现中间人攻击的常用手段,从而实现数据 ...

  5. Python黑客编程基础3网络数据监听和过滤

    网络数据监听和过滤 课程的实验环境如下: •      操作系统:kali Linux 2.0 •      编程工具:Wing IDE •      Python版本:2.7.9 •      涉及 ...

  6. DedeCMSV57数据库结构文档

        表名:dede_addonarticle(ENGINE=MyISAM/CHARSET=gbk) 说明:Top 字段名 说明描述 具体参数 aid 文章ID mediumint(8) unsig ...

  7. Oracle - PL/SQL Commands

    第一章:日志管理 1.forcing log switches sql> alter system switch logfile; 2.forcing checkpoints sql> a ...

  8. 常用ASP函数的封装

    做ASP开发常常需要用到一些小功能,这些功能通常我们都会封装成函数来使用,本教程提供了许多我们经常用到的ASP函数. <% '所有功能函数名如下: ' StrLength(str) 取得字符串长 ...

  9. javascript版QQ在线聊天挂件

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. 简明Vim练级攻略

    原文:酷壳网 vim的学习曲线相当的大(参看各种文本编辑器的学习曲线),所以,如果你一开始看到的是一大堆VIM的命令分类,你一定会对这个编辑器失去兴趣的.下面的文章翻译自<Learn Vim P ...

  2. YZOI回忆录&&YZOI3.0介绍&&某些资源的分享

    “那段时光就像块透明的琉璃,美得那么虚幻.飘渺.可是它毕竟在我生命里闪现,哪怕如萤光一样微弱,却照亮了我整个心房.”1.前序伴随着yzoi2.0版本离我而去的是我半年的OI生涯,在这半年内我步入了一个 ...

  3. ZOJ 3872 Beauty of Array

    /** Author: Oliver ProblemId: ZOJ 3872 Beauty of Array */ /* 需求: 求beauty sum,所谓的beauty要求如下: 1·给你一个集合 ...

  4. Javascript 类数组(Array-like)对象

    Javascript中的类数组对象(Array-like object)指的是一些看起来像数组但又不是数组的对象.Javascript中的arguments变量.document.getElement ...

  5. Js冒泡事件和捕获事件

    js中冒泡事件和捕获事件: 冒泡事件:冒泡事件是从里向外,即是从被绑定元素开始一直向外到达页面的所有祖先元素都会被触发,这 一过程被称为事件冒泡.这个事件从原始元素开始一直冒泡到DOM树的最上层 捕获 ...

  6. 面试小结(java基础)

    一个.java源文件中可以有多个类吗?(内部类除外)有什么条件?带着这个疑惑,动手建几个测试类, 揭开心中的疑惑.以下是解开疑惑过程: package test;/** * 一个.java源文件中可以 ...

  7. CSS3 box-shadow(阴影使用)

    from: http://jingyan.baidu.com/article/03b2f78c4d9fae5ea237aea6.html css3 box-shadow 内阴影与外阴影 1- box- ...

  8. VIM中文乱码

    下面是关于VIM中文乱码问题的解决方法: 打开VIM的配制文件在里面加上一段这样的代码就可以了: set encoding=prc

  9. python学习第五天 List和tuple类型介绍及其List切片

    List 和tuple: python提供一种类似C语言数组的类型,但是使用起来确是相当的简洁.那就讲讲这神奇的python中list 和tuple吧. List类型: 1.直接贴代码: L = [' ...

  10. Day14 html简介

    初识html <!DOCTYPE html> <html lang="en"> <head> <!--自闭合标签--> <me ...