此文章转载自 我的博客
Progressive Web Apps
今年如果你关注过 Chrome 开发团队的话，那一定或多或少的会听到过 Progressive Web Apps（PWA），实际上，今年 Chrome 团队可谓是 倾尽全力的推广 PWA，从上半年的 Google IO 大会关于 各类有关 PWA 的 9 个专题，直到今天刚刚结束的，基本是 PWA 推广大会的 CDS，可见随着 PWA 技术的成熟以及浏览器的支持度提高，不久必将会迎来一次爆发。如果你目前还不了解什么是 PWA ，请去 这里 自行补脑，这里我简单来说，PWA 就是能够提供类似像 Navive App 一样体验的 Web App。它主要有几个特点：
可以添加到桌面，文艺点说就是具有可安装性
离线能力
消息推送
安全
响应式
博主凑热闹，最近把 我的博客 添加了离线和添加到主屏幕功能，如果你的手机支持（安卓手机新版 Chrome，目前苹果还不支持），当然，或者是 PC 端的 Chrome，欢迎体验。
好了，废话不多说，这次大会在 youtube 上实时更新，我趁热挑选了自己感兴趣的几个主题，整理了主要内容，由于时间比较短，有些内容只是知道了概念（甚至有些只知道了个新名词），如果不对，欢迎大家留言指正，我后面也会陆续更新。
KeyNote
点击 这里 观看视频。
首先是 Darin Fisher 的开场，介绍了 Chrome 以及 Web 的现状。
目标：让 Web 变得更先进。
目前 Chrome 拥有 20 亿用户（手机+PC）
Link 很牛
每次交互的改变将会挖掘 20% 的潜在用户
移动端 Web：局限带来创新
移动端的挑战：分辨率，cpu，内存，电池，网络
60% 的手机用户是 2G 网络
印度 2.3 亿，美国 4.6 亿，中国 7.6 亿的网民
在印度 65% 人不上网，美国 20%
Progressive Web Apps 从根本上提高 web 体验
用 阿里 的 PWA 举例（原来老外也知道双十一），提高了 76% 的转化率
超过 3 秒的网页，53% 的用户选择离开
Service Worker API
在 3G 环境下，要确保页面 5 秒内加载完成
“添加到主屏幕”这个功能提高了用户 4 倍的浏览频率
消息推送：每天都有来自 5 万个域名下的 180 亿次推送
Seamless Sign-In：在 AliExpress 中降低 85% 登陆失败的几率，提高了 11% 的转化率
Payment API
Lighthouse 是个测试 PWA 的工具（测试了一下我博客的分数，居然到了80分，窃喜~）
Polymer
AMP（Accelerated Mobile Pages）
browser-issue-tracker-search 为开发者提供的网站，包括bug，w3c 标准，API 建议等
Web assembly, WebGL 2.0, WebVR, WebAR, WebBluetooth
Building Progressive Web apps.
点击 这里 观看视频。
Thao Tran 主要是用一些数据和示例为我们展示了 PWA 的价值以及意义。
去年的时候基本只有 Flipkart 做了 PWA 的产品，但今年目前为止已经有来自 35 个国家的 17K 个 PWA。
在美帝，PWA 已经常常会出现在各个热门技术杂志的头条。
简单介绍什么是 PWA
列举了几个 PWA 的例子以及带来有力数据，https://m.alibaba.com/，https://housing.com，这里不得不膜拜一下阿里。数据主要集中在用户转化率，效率以及开发成本。
用 West elm show 一下 PWA。
围绕 PWA 加载快，省流量列举数据。
再次列举几个 PWA 产品。
Future App Model: Advanced Service Worker
Jake 大神的演讲其实在他 之前的博客 中介绍过一些内容，演讲诙谐幽默，并又带来了很多干货：
-
介绍了 Service Worker 浏览器支持情况：
Chrome/Firefox：支持
Edge：实现中(高优先级)
Safari：Considering...(这里不知道怎么翻译，犹豫中？思考中？)
-
Stream
Async iterators（https://github.com/tc39/proposal-async-iteration）
Transform streams（https://streams.spec.whatwg.org/）
Identity Streams
抛出 SPA 不如 Server Rendering 快的问题。
Service Worker + Streams 可以改善，但还是不能做到 SPA 比 Server Render 快并用 github 举了例子。
然而，PWA != SPA
Navigation preload
Forigen Fetch
Background Fetch
Navigation transitions
Progressive Performance
点击 这里 观看视频。
这次 Alex 并没有直接说 PWA 的话题，而是为我们带来了移动端性能方面的分享，指出了现在移动端性能低下，要注重在恶劣环境下（网络差，设备低电量等）还保持一个好的用户体验。
Mobile website 越来越重要
在 PC 开发环境下看起来性能还不错的网站，在手机上其实并不尽人意
如果你的页面在 3 秒钟加载不出来的话，有 53% 的用户会选择离开
而报告中表示手机网页打开的平均时间在 19s
Motion Mark 测试，PC 要比手机端快 25 倍
要用真机 Debug
要重视低端设备
Power = Heat，硬件限制以至于手机不能比 PC 快
少加载 code，在合适的时间执行合适的代码
Service Worker 不仅仅是离线，更重要的是提升效率
The “Progressive” in Progressive Web Apps
点击 这里 观看视频。
Patrick Kettner 是来自微软 Edge 的 PM，他演讲的主线是他儿子顺便介绍了一下 PWA，但由此可见微软支持 PWA 只是早晚的事情。
2g 网络毁了他的生活
回顾了一下 App Cache
提供了一种新的 开发方式
PWA 在 Edge 上
WebWorkerPreProcessor
What Comes Next for the Web?
点击 这里 观看视频。
Paul 主要分享了关于 Web 未来的发展方向，包括 WebVR，性能提升等等。
Web 一定会赶超 Native APIs
手机游戏会与 Native 平起平坐，并带来更高的利润
-
现有 API
定位（Geolocation）
相机（Camera）
麦克风（Microphone）
电池（Battery）
权限（Permissions）
网络状况（Network）
自动填充（Autofill）
用户授权（Credential Management API）
支付（PaymentRequest API）
消息推送（Push notifications）
离线（Offline）
可安装（Installability）
SLICE（Secure，Linkable，Indexable，Composable，Ephemeral）
-
计划：
-
已经实现的
position: sticky，Intersection Observer, Web Componensts, PointerEvents
PWA：App drawer，system UI.
PWA ACTION_VIEW
从消息启动应用
名称和图片可更新（manifest.json）
manifest.json 添加 scope 属性
chrome://flags/ 启用这些功能
-
将会实现
Web Share API
Media improvements（多设备之间）
Background playback（比如锁屏后的音乐）
canvas.captureStream() + Web RTC
canvas.captureStream() + MediaRecorder.
ImageCaputre API.
FaceDetector API.
AmbientLightSensor API.
Fused Sensors
-
新的交互方式
Physical Web.
Web Bluetooth.
WebUSB.
WebVR.
-
观后感
这周末在家宅两天来看会议视频其实还是值得的，有了不少收获。这次大会几乎所有人的演讲都会提到 PWA，PWA 是 Chrome 团队近两年来全力推广，安卓系统也提供全方位的支持，PWA 必将会是未来 Web 发展中非常重要的一步。同时 PWA 也涵盖了很多新技术，Service Worker，Streams，Cache，用户授权还有大会中提到的相机，支付等等原生 API ，所以看来前端之路，路漫漫其修远兮。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。