浅谈一下我了解的PWA

Progressive Web Apps,简称PWA，中文翻译过来就是渐进式网页应用，个人觉得它可以算是Web应用的下一个进化方向之一，毕竟技术的发展有时候是不可预估的，谁也无法预料技术的走向，但至少它代表了一种可能性，下面我们就一起来了解下这种新兴技术。

以下仅代表个人见解和认知，有结合其他大神的文章的分析，如有不足之处欢迎指正！

一、什么是Progressive Web Apps?

Progressive Web Apps，简称PWA，中文直译过来就是渐进式Web应用，一个合格的PWA，应该具有但不限于以下特点：

渐进式：针对不同版本不同内核的浏览器，它的功能能够渐进式的增强，随着用户与应用之间的联系加深，如果用户需要，网页可以渐进式地变成App，比如被添加到主屏幕、全屏方式运行、离线工作、推送通知消息等。但它仍是 Web 而非放到 App Store 里。

响应式：适应多种运行环境，无论是移动端、web端还是平板电脑等等。

对网络环境的弱依赖： 得益于谷歌的service worker技术，使PWA极大降低对网络环境的依赖，能够在离线或者网络极差的环境下工作。

持续更新：同样由于service worker的存在，应用能够轻松实现持续更新。

类原生体验：有像原生应用般的交互和导航给用户原生应用般的体验，如果用户愿意，特闷可以选择将PWA应用添加到手机主屏幕，同样得益于service worker，它甚至可以让PWA应用像原生应用一样接收消息推送。

安全：通过 HTTPS 来提供服务来防止网络窥探，保证内容不被篡改。

二、我个人对PWA的一些认知

以上对PWA的一些定义，都是一些官方的定义或者一些大神的认知，下面来谈谈我个人对PWA的一些认知，以及它和目前的Hybrid App、小程序、快应用的区别。

目前市场上主流的Hybrid App无非两种做法：

1.类似React Native这种，通过JavaScript语言进行开发，视觉上通过标签转义，将RN标签转化为手机原生图形界面；操作上通过js调用手机底层硬件和SDK；这种做法的优点是APP体验好，缺点是开发周期几乎和原生APP差不多

2.国内外很多中小企业比较青睐的H5页面套APP外壳的做法，例如国内的APICloud、H5plus等等，其本质上只是一个可以访问特定H5页面的浏览器；这种做法的优点是开发周期短，缺点是体验和性能都较差。

而小程序和快应用，个人认为更多的是借鉴React Native的思路进行实现的，尤其是微信小程序，基本上就是沿用了RN的那一套。

那么PWA和以上几种应用的区别在哪里呢？有些人可能会觉得PWA和小程序以及快应用几乎没什么区别，但在我看来，PWA和小程序、快应用、混合APP这些东西天生就不一样！

还记得PWA的全名吗？Progressive Web Apps，这里已经写得很明确了，它是Web App啊，React Native、小程序、快应用一直在致力于去HTML化，虽然他们都是使用JavaScript作为开发语言进行编写的，但是你要知道，JavaScript本就不是只为HTML而生的，如果你有阅读过相关书籍你就会知道，JavaScript其实可以在浏览器以外的环境下运行！

以上其它应用，基本都已经摒弃了HTML中除了JS以外的其它内容，但是PWA不一样，它从骨子里仍然是一个Web页面！说到Web App,有些同学可能会嗤之以鼻，确实，当前市场下，Web App也就是移动端Web页面的份额已经极大化的萎缩（下图是google发布的移动Web和App使用时长占比），或者说Web App可能从来没有辉煌过，从传统电脑端转移到智能手机时代，中间的过渡其实非常短，相信这点大家都是感同身受的，但是现在，谁也说不准Web App是否来到了一个风口位置 -- 因为有了PWA，你访问的Web页面已经有了能够媲美原生App的体验！

三、PWA将如何改变我们的移动体验？

当你在手机浏览器中打开一些Web网页时，经常会看到以下的页面:

这些Web App会推荐你打开它们的原生应用，如果你的手机没有下载则会跳转到相应的下载页面，但是对于用户来讲，在没有WIFI的情况下可能并不想为了一个不常用到的App消耗流量和系统内存，或者手机容量比较吃紧的用户，可能有时候会为了删除哪些应用保留哪些应用而犹豫不决，现在有了PWA，一切都能迎刃而解！而这些，还不是全部！

在2016年11月google团队已经在尝试并初步实现把「添加至主屏」重命名为「安装」，被安装的 PWA 不再仅以 widget 的形式显示在桌面上，而是真正做到与所有原生应用平级，一样被收纳进应用抽屉（App Drawer）里，一样出现在系统设置中。

PWA能够获得和原生APP同级的权限，也能够像原生APP一样实时获取推送消息，即使你在以后想要删掉这个PWA应用，你也依然可以在浏览器中获得高质量高体验的Web页面，在Web端，甚至Mac环境下也能享受到这种体验！

四、案例欣赏

国内外有一些优秀的技术团队已经开始尝试并推出了一些不错的PWA应用，我这里简单介绍下两个已知的

FlipKart(印度)

离线情况下的视觉差异

豆瓣(中国)

更多专业前端知识，请上【猿2048】www.mk2048.com

浅谈一下我了解的PWA相关推荐

浅谈MySQL存储引擎-InnoDBMyISAM
浅谈MySQL存储引擎-InnoDB&MyISAM 存储引擎在MySQL的逻辑架构中位于第三层,负责MySQL中的数据的存储和提取.MySQL存储引擎有很多,不同的存储引擎保存数据和索引的方式 ...
【大话设计模式】——浅谈设计模式基础
初学设计模式给我最大的感受是:人类真是伟大啊!单单是设计模式的基础课程就让我感受到了强烈的生活气息. 个人感觉<大话设计模式>这本书写的真好.让貌似非常晦涩难懂的设计模式变的生活化.趣味化 ...
学校计算机机房好处,浅谈学校计算机机房维护
浅谈学校计算机机房维护现在的学校机房都配置了数量较多的计算机,而且机房的使用非常频繁.对于怎样维护好计算机,特别是计算机软件系统,对广大计算机教师来说是一个很重要且非常现实的问题.下面就本人在 ...
java 中的单元测试_浅谈Java 中的单元测试
单元测试编写 Junit 单元测试框架对于Java语言而言,其单元测试框架,有Junit和TestNG这两种, 下面是一个典型的JUnit测试类的结构 package com.example.dem ...
mybatis与php,浅谈mybatis中的#和$的区别
浅谈mybatis中的#和$的区别发布于 2016-07-30 11:14:47 | 236 次阅读 | 评论: 0 | 来源: 网友投递 MyBatis 基于Java的持久层框架MyBatis 本 ...
浅谈GCC预编译头技术
浅谈GCC预编译头技术文/jorge --谨以此文,悼念我等待MinGW编译时逝去的那些时间. 其实刚开始编程的时候,我是丝毫不重视编译速度之类的问题的,原因很简单,因为那时我用BASICA.后来 ...
【笔记】震惊！世上最接地气的字符串浅谈(HASH+KMP)
震惊!世上最接地气的字符串浅谈(HASH+KMP) 笔者过于垃圾,肯定会有些错的地方,欢迎各位巨佬指正,感激不尽! 引用:LYD的蓝书,一本通,DFC的讲稿,网上各路巨佬 Luguo id: 章鱼那个 ...
浅谈几种区块链网络攻击以及防御方案之其它网络攻击
旧博文,搬到 csdn 原文:http://rebootcat.com/2020/04/16/network_attack_of_blockchain_other_attack/ 写在前面的话自比特 ...
浅谈几种区块链网络攻击以及防御方案之拒绝服务攻击
旧博文,搬到 csdn 原文:http://rebootcat.com/2020/04/14/network_attack_of_blockchain_ddos_attack/ 写在前面的话自比特币 ...

浅谈一下我了解的PWA

浅谈一下我了解的PWA相关推荐

最新文章

热门文章