Google I/O 2018 : Web 现状综述

本文首发于掘金，各位可以通过点击文章下方的阅读原来来访问原文地址。本文略有修改。

无论是在桌面端还是在移动端 ，Web 都处于高速发展中。每个人都能轻松地构建快速且身临其境的页面。同时，开发者工具也越来越强大、越来越多样。 Google I/O 2018, chrome 团队 leader Ben Galbraith 和 amp 项目 leader Martha 携手从 Google 的角度描绘了 Web 世界的现状。

Service Worker

Service Worker 可能是过去 10年中 Web 提供的一个最为重要的 API。它提供了大量高级别的抽象，使得 Web 的能力不再局限于展示页面。现在 Web 可以接收消息推送等事件、处理异步数据传输、甚至控制网络连接 。

目前，包括 safari、edge 在内的各大浏览器都已经支持 Service Worker。

大量 PWA 也开始在商业活动中展露头角。例如 ofo(需访问外国网站) 的 PWA 使用 Geolocation 进行定位、Camera API 进行二维码扫描实现了用户无需下载安装 App 也能用车。1800flowers.com 通过 PWA 使得交易量增长了50%。巴西最大的媒体公司 EDITORA GLOBA 将网站升级为 PWA 之后，用户停留时长提升了50%。星巴克也从 PWA 受益，日活跃用户数和月活跃用户数均增长了2倍。google ads 的客户，在将网站升级为 PWA 之后，平均会话量提升了20%。

许多 Google 的产品也在使用 Service Worker。Service Worker 使得 Google Search 每次加载减少 50% 的外部 JavaScript 下载、交互延迟降低了 6%。

Bulletin 由于使用了 Service Worker,首屏加载速度大幅提高，同时实现了一套代码运行在 Android、iOS、desktop 等多个平台。 Google Maps 针对印度的弱网环境和低性能设备开发了 PWA，节约了用户花在数据上的费用。

桌面版 chrome 将在六月份增加 add to home screen 功能，使得 PWA 能够像普通应用软件一样直接点击桌面上的图标打开。

Web Media

chrome 采集的数据显示，在 Android 设备上有 15% 的时间、桌面端超过 20% 的时间是在播放视频。全世界每天有超过30000年时长的视频被观看。 因此有大量媒体相关的 API 被提出。

Media Session API 允许页面为标准媒体交互提供自定义行为。vimeo 通过这个接口实现了锁屏时暂停播放视频。

Media Capabilities API 使得浏览器能够自动根据设备状况选择视频流的来源。

Picture-in-Picture Support 使得视频能够在显示屏的任意位置播放。

Presentation API 能够更加精确的控制在第二显示屏上展示的内容。

AV1 视频编码格式也将在今年应用于 chrome。

WebAssembly

WebAssembly是一种新的编码方式，可以在现代的网络浏览器中运行 － 它是一种低级的类汇编语言，具有紧凑的二进制格式，可以接近原生的性能运行，并为诸如C / C ++等语言提供一个编译目标，以便它们可以在Web上运行。它也被设计为可以与JavaScript共存，允许两者一起工作。

通过 WebAssembly ，可以直接把 C/C++ 应用移植到 Web 中，对性能有极高要求的 Web 应用也可以通过 C/C++ 等语言重新编写，网页游戏也将进入一个新的阶段。

网页性能

V8 引擎对 JavaScript 性能的不断优化使得 Web 应用的响应速度得到了大幅度的提升。

Speedometer 是一个衡量 Web 应用性能的浏览器基准。Chrome 团队和社区合作推出了 Speedometer2.0。从上图可以看到，相同的硬件设备，如果你的应用是基于 React 构建的，性能足足提升了 112%。

另外，Google 在过去几个月，还发布了大量 Web 相关的工具、库等。

比如 lighthouse 3.0、Workbox