什麼是漸進式Web App？為什麼值得關注？

註：這是一篇翻譯的文章，原文地址：https://codeburst.io/what-is-progressive-web-app-and-why-should-you-care-e397e24b1257

在開始PWA這個話題之前，我們先來看看Internet現狀。

截至2017年1月，全球有80.5億台聯網設備（超過目前全球人口的75億）。 這其中55％（44.2億）是智能手機設備。移動設備上的Chrome瀏覽器每月有10億用戶使用，比上一年增長了150%。

據估計，到2020年全球將有400 - 500億台設備互聯。 大部分用戶將來自農村和其他發展中國家，這些國家的數據要麼昂貴，要麼高延遲，或兩者兼而有之。

用戶行為：

來源：comScore Mobile Metrix, U.S

那麼問題來了，為什麼用戶更喜歡使用應用程序而不是網站。

原因在於，原生應用程序具有以下優點

• 可靠

• 啟動快

• 可以離線工作

• 推送通知將用戶帶回應用程序

• 可見的主屏幕圖標

但是，移動web的訪問率幾乎是應用程序的三倍

來源：comScore Mobile Metrix, U.S

當問題回到用戶參與度上，移動web相較本地應用程序存在巨大差距（主要是由於Native應用程序提供了更多的優勢和更好的用戶體驗）

移動web的優勢

即時性- 移動網站即時可用

那麼，即使用戶參與度較低，原生應用也能擊敗移動互聯網，這是什麼原因？

根據谷歌的研究，移動網站的平均載入時間是19秒，而用戶期望在3秒之內載入該網站。所以如果網站載入時間超過3秒，將會損失大約40％的用戶。如果需要超過10秒，將損失100％的用戶。

此外，點擊主屏幕圖標比輸入網址更輕鬆。

移動網站無法進行推送通知。

解決方案？

漸進式Web App（PWA）

什麼是PWA？

PWA結合了最好的Web應用和最好的原生應用的用戶體驗。

包括

• 漸進式- 每個用戶都可用而不管選擇什麼樣的瀏覽器，因為它們是以漸進式增強為核心原則構建的。

• 自適應- 適應任何形態：桌面，移動設備，平板電腦或尚未出現的形式。

• 不依賴網路連接-Service Workers允許離線工作，或在低質量網路上工作。

• 類似於應用程序- 使用應用程序風格的交互和導航，感覺像一個應用程序。

• 保持最新- 得益於service Woker的更新進程，應用能始終保持最新狀態。

• 安全- 藉助於HTTPS，防止窺探，並確保內容沒有被篡改

• 可發現- 受益於W3C清單和service Worker註冊作用域，搜索引擎可找到它們，可以識別為「應用程序」。

• 用戶粘性- 通過推送通知等功能讓用戶重返應用。

• 可安裝- 允許用戶在主屏幕上「保留」他們認為最有用的應用程序，而無需經過應用程序商店。

• 可鏈接 - 通過URL輕鬆共享，不需要複雜的安裝。

基本架構

Service Worker

位於客戶端（瀏覽器）和伺服器之間的代理。

• 註冊Service worker

sw_register.js

• 如果瀏覽器支持SW並且已註冊，則SW文件將在ServiceWorkerGlobalScope中運行，這是一個獨立的執行線程，不具有DOM訪問許可權，也不會干擾JS主線程。 Service worker生命周期事件包括。

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！