Google力推的那些前端技術，最近有何進展？

Google I/O 2018 已于上周落下帷幕，普通民眾看的是新產品，開發者們關注的是新技術。透過這次大會，我們不難發現，Google 已經從 mobile first 轉向 AI first，AI 之后，就是移動和前端技術了，移動無非是 Android P 和 Flutter 等，前端涵蓋的技術從 Web 框架到 Web 工具，包括 Angular、PWA、polymer、AMP 等，下面讓我來為大家捋一捋 Google 力推的這些前端技術最近都有哪些進展。

Angular

Angular 是前端三大框架之一，它與 React、Vue 的“爭斗”一直都沒有停止過，經過 Angular 團隊和開發者們的努力，Angular 已經建立了擁有上百萬開發者規模的社區和生態系統。在今年I/O大會開始的前幾天，Angular 6 正式發布，添加了 ng update 和 ng add 這樣的新功能，讓你的應用程序保持最新的狀態，幫助 Angular 開發者加快創新的步伐。

Angular 渲染器 Project Ivy 也有很大的改進，它能使 Angular 調試更容易，以更快地速度編譯和運行，它還可以與現有的應用程序一起使用，Angular 團隊還在小型 Hello World 應用程序做了演示，不使用的 Angular 功能將自動從應用的 JavaScript bundle 自動刪除。

PWA

PWA 應該是這兩年前端最火的技術之一了吧。Google 聲稱世界各地各行業在在 PWA 的構建上都獲得了很大的成功，星巴克在推出 PWA 網站后，日活躍用戶數量增加了 2 倍，他們對廣告網站進行測試，發現當一個網站切換到 PWA 時，平均轉化率提高了 20%。

PWA 近期動態：

• 早期的 PWA 主要專注于移動設備，但是由于平臺限制，iOS 無法支持，但是今年年初，終于迎來了好消息，蘋果宣布 iOS 11.3 將迎來 PWA，這使得開發跨平臺的 PWA 成為了可能。

• 2 月，微軟著手在 Windows 商店中增加 PWA，宣布漸進增強式 Web 應用將在 Win10 系統上線。

• 2 月底，PC 端的 Chrome 正式支持 PWA，具體實現方式可參考本篇文章。

• I/O大會上，Google 宣布今年 6 月，Chrome 67 將支持 PWA“安裝”到桌面上，同時保留在瀏覽器中查詢的功能，如在頁面中查找、共享網址、Google Cast 支持等，下圖為 Spotify 部署桌面 PWA 后的部分體驗。

Service Worker

Service Worker 是近年來 Web 最大的改進之一，它是 Chrome 團隊力推的一個 Web API，它將開發人員從頁面的生命周期中解放出來，運行于瀏覽器后臺，可以控制打開作用范圍下的所有頁面請求，使 Web 應用程序能夠脫機工作。

今年三月，蘋果宣布 iOS 和 MacOS 上的 Safari 11.1 支持 Service Worker，4 月底，微軟也宣布 Microsoft Edge 也將支持 Service Worker，這意味著現在所有的主流瀏覽器都支持 Service Worker 了。

為了使用過程更簡便，Service Worker 開發團隊創建了 Workbox 庫，它能將許多常用的、強大的 service worker 模式封裝到易于使用的 API 中。

Workbox：

https://developers.google.com/web/tools/workbox/

WebAssembly

WebAssembly 使網站能夠運行用C或 C ++ 等語言編寫的高性能低級代碼，為 Web 打開了新世界，今年 3 月，來自 Autodesk 的 AutoCAD 就采用了 35 年前的代碼庫，并用 WebAssembly 編譯讓其直接在瀏覽器中運行，這意味著，無論你的設備或操作系統如何，你都可以直接在瀏覽器中用 CAD 繪圖。

Polymer

Polymer 是 Google 主推的一個 JavaScript 庫，它可幫助你創建自定義的可重用 HTML 元素，并使用它們來構建高性能、可維護的 App。

在I/O大會上，Google 推出了 Polymer 3.0，Polymer 3.0 致力于將 Web 組件的生態系統從 HUML Imports 轉移到 ES Modules，包管理系統將支持 npm，這使你更容易將基于 Polymer 的 web 組件和你喜歡的工具、框架協同使用。

AMP

AMP 是 Google 推出的一種為靜態內容構建 Web 頁面，提供可靠和快速渲染，加快頁面加載速度的 Web 組件庫。目前為止，來自 4600 萬個域名的網頁已經超過 60 億個，他們在 Google 搜索的平均加載速度不超過 1 秒。

由于移動內容消費正在往全屏、簡練的排版風格轉變，為了滿足內容發布商的需求，APM 團隊日前宣布開發了 AMP stories，它是一套為 mobile-first storytelling 開發的 Web 組，它支持原生視頻和圖像，具有豐富的視覺效果，可通過動畫和可點擊的交互方式來講故事，這對于突發事件的新聞報道具有重要作用，因為有時候圖片能更直觀和快速地向讀者表達意思。

Lighthouse

Lighthouse 是一個分析網絡質量的工具，為你提供網站性能衡量指標和指導，它可以直接從 Chrome DevTools 內部進行訪問，從命令行運行或與其他開發產品集成，僅在 2018 年，就有 50 萬開發人員在他們的網站上運行 Lighthouse。

本月初，Lighthouse 3.0 發布，最新的版本對網站的審核速度會更快，具有全新的報告界面，更多更新內容，可進入 Lighthouse 官網查看。

鏈接：https://developers.google.com/web/updates/2018/05/lighthouse3

參考鏈接

https://blog.chromium.org/2018/05/the-state-of-web-at-google-io-2018.html

來自: InfoQ