PWA是什么



PWA(Progressive Web Apps)是 Google 最近在提的一种 Web App 形态 （或者如 Wikipedia 所称的“软件开发方法”）。PWA 意图让 Web 在保留其本质（开放平台、易于访问、可索引）的同时， 在离线、交互、通知等方面达到类似 App 的用户体验。按 Google 官方的解释 PWA 具有这些特性：Reliable, Fast, Engaging。具体技术包括 Service worker、 Web App Manifest、 Cache API、 Fetch API、 Push API、 Web Push Protocol、 Notification等。

简单点就是：像APP一样可被添加到手机桌面或者电脑桌面的网站

安装一个PWA应用看看

第一部：升级到最新版本chrome

浏览器地址打开：chrome://settings/help

第二部：开启

浏览器地址打开：chrome://flags/，打开后长这样：

然后搜索progressive，红色部分设置为Enable



然后重启浏览器！

体验一把

浏览器打开：https://mobile.twitter.com

安装到桌面：

安装完后桌面有一个图标：

这个twitter lite就是一个采用了PWA技术的Web应用程序，具有PWA的所有特性。

更多内容，请点击阅读原文

作者知乎/公众号：前端疯 （一群热爱前端的一线程序员维护，想要用前端改变世界。）

新事物学习---Chrome上使用PWA的更多相关文章

  1. 新事物学习---WebApp移动端手势Hammer

    花落水流红,闲愁万种,无语怨东风. Hammer介绍 Hammer库是一个移动端手势库,移动端的手势操作(比如touch,tap,拖动,滑动等等)都可以用这个库,而我们不用关心,它的底层方案具体是怎么 ...

  2. Jeddict：从服务器的验证过程，思考学习新事物的套路

    结合一路研究Jeddict使用的过程经验来看,在这里说一下关于服务器配置的东西.在我们团队,最开始用这个插件的时候,因为公司用的应用服务器是Jboss EAP 7,所以,我们自然而然的,想当然的直接使 ...

  3. cVim—Chrome上更强大的vim插件

    cVim——Chrome上更强大的vim插件 介绍 也许很多人在chrome上都用过类似Vimium, ViChrome的插件,这些插件的目的都差不多,就是在浏览器中提供一些类似vim的操作来提高效率 ...

  4. 看来IT技术与军事技术都是相通的——都是对新事物极为敏感的领域

    这是读到这段时候的感想: 和海军中那些狂热的相信“皇军不可战胜”的大舰巨炮主义者们不同,山口对于与美国开战的主张是持坚定的反对态度的,和山本五十六都做过日本驻美武官的山口都认为一旦与美开战,日本或许能 ...

  5. zookeeper学习（上）

    zookeeper学习(上) 在前面的文章里我多次提到zookeeper对于分布式系统开发的重要性,因此对zookeeper的学习是非常必要的.本篇博文主要是讲解zookeeper的安装和zookee ...

  6. 微软Ignite2018——微软宣布新的学习平台：Microsoft Learn

    Ignite 2018 首日感受 头一次参加美国的微软 Ignite 大会,确实规模比国内的大不少.23日是 MVP & RD 的 Pre Day(MVP即Most Valuable Prof ...

  7. cVim——Chrome上更强大的vim插件

    ref: http://www.cnblogs.com/voidsky/p/5490787.html 介绍 也许很多人在chrome上都用过类似Vimium, ViChrome的插件,这些插件的目的都 ...

  8. 搜索引擎的选择与在chrome上的设置

    1  优缺点分析 百度:广告多,但是电脑端可以用Adblock Plus屏蔽:搜索内容有很多百度自家内容,如百家号.百度知道.百度文库.百度贴吧等,在搜索教程的时候很实用,但是不适合偏专业性搜索,很多 ...

  9. C++中多态性学习（上）

    多态性学习(上) 什么是多态? 多态是指同样的消息被不同类型的对象接收时导致不同的行为.所谓消息是指对类的成员函数的调用,不同的行为是指不同的实现,也就是调用了不同的函数.虽然这看上去好像很高级的样子 ...

随机推荐

  1. IOS开发之XCode学习013：步进器和分栏控件

    此文学习来源为:http://study.163.com/course/introduction/1002858003.htm 此工程文件实现功能:  1.定义UIStepper和UISegmente ...

  2. js call的方法

    call 方法 请参阅 应用于:Function 对象 要求 版本 5.5 调用一个对象的一个方法,以另一个对象替换当前对象. call([thisObj[,arg1[, arg2[, [,.argN ...

  3. 【BZOJ4825】【HNOI2017】单旋（Link-Cut Tree）

    [BZOJ4825][HNOI2017]单旋(Link-Cut Tree) 题面 题面太长,懒得粘过来 题解 既然题目让你写Spaly 那就肯定不是正解 这道题目,让你求的是最大/最小值的深度 如果有 ...

  4. 如何将VMware虚拟机迁移到AWS

    在工作中,我们一直在努力将我们的一些VMware工作负载转移到AWS,并且我的任务是将几个VMware虚拟机迁移到AWS,作为暂时的概念验证. 在本文中,我将展示如何设置AWS连接器并使用AWS服务器 ...

  5. Spark ML源码分析之一 设计框架解读

    本博客为作者原创,如需转载请注明参考           在深入理解Spark ML中的各类算法之前,先理一下整个库的设计框架,是非常有必要的,优秀的框架是对复杂问题的抽象和解剖,对这种抽象的学习本身 ...

  6. C# 程序之间传参数，Args 接收参数的处理

    备忘,或者留给暂未接触但需要了解的人. C#在一个进程内传参数方法那是相当多,但是涉及到程序之间传参数就不是那么方便了(当然socket,内存共享等方式属于另一类,此处不讨论),我们的C或者C#,亦或 ...

  7. 清除input[type=number]的默认样式

    input[type=number] { -moz-appearance:textfield; } input[type=number]::-webkit-inner-spin-button, inp ...

  8. Error:Error converting bytecode to dex: Cause: com.android.dex.DexException: Multiple dex files define Lcom/google/android/gms/internal/adp;

    Q:版本号不对,广告插件的版本号和项目中用的版本号不一致 A:adsplugins的build gradle里面用的版本号是10.0.1,修改app的build gradle 的google类都改成1 ...

  9. 大三小学期 web前端开发的一些小经验

    1.html是页面的布局设计,就是页面上要放哪些东西,比如登录界面需要按钮,输入框等等:css是被用于使用设计部件和布局,例如哪些部件放在哪里,多宽多大,是否有边框等:js/jQuery是用于实现函数 ...

  10. Windows下Python环境的搭建

    我刚开始接触Python没多久,当然这也是为初学者来更好的去入门Python,我电脑上既跑着Windows也跑着Red Hat的Linux,相比较而言,开发我还是更青睐于Linux系统,很多开发工具红 ...