PWA vs 傳統APP

什麼是PWA?

Progressive Web Application (PWA)是一種新式的網路應用程式概念，最早是在2015年被提出，並且在次年的Google I/O大會上列入重點開發項目

PWA好處

• 可靠 – 即使在不穩定的網絡環境下，也能瞬間加載並展現
• 體驗 – 快速響應，並且有平滑的動畫響應用戶的操作
• 粘性 – 像設備上的原生應用，具有沉浸式的用戶體驗，用戶可以添加到桌面
• PWA本身強調漸進式，並不要求一次性達到安全，性能和體驗上的所有要求，開發者可以通過PWA清單查看現有的特徵。

PWA用戶體驗

• PWA 能擺脫原生系統（iOS/Android）限制在跨平台使用，無需針對不同平台開發 native app，節省成本和時間；
• PWA 體積細小而且無需前往 app store 就可以直接下載，安裝體驗更流暢，也減少佔據手機容量；
• PWA 是與您的網店合併，用戶可以在 Google 搜尋到你的企業，能接觸更大的潛在客戶群；
• PWA 比一般網站和APP更強大：你無法在離線時訪問一般網站同APP，但 PWA 在離線時仍可以有限度運作；
• 只要用戶將 PWA 加到手機桌面。PWA 同時可推播通知、打開時產生啟動頁面，設計成熟的 PWA 基本與 app 感受無異。

知名企業品牌也使用 PWA 例子

Starbucks

Uber

Pinterest

Housing.com

Flipboard

2048 Game

PWA 大不同

PWA 既有 app 的優良體驗，又改善了 app 的缺點，就連知名企業品牌也把 PWA 納入產品線：

• 社交媒體 Twitter 在 2017 年推出 PWA 版本 Twitter Lite 讓用戶的平均瀏覽頁數增加 65%、發送 tweet 數量提升 75%、網站跳出率（bounce rate）降低 20%；貼心的 data saver mode 也能減少數據流量高達 70%。PWA 的表現媲美原生 app，但比起 Twitter 的 Android app 只佔據少於 3% 的手機容量。
• 交友軟體 Tinder 的 Android app 體積是 30MB，PWA 版本縮小了 90% 只有 2.8 MB，同時也縮短了載入時間，改善用戶體驗。不管是 tinder 招牌式的左右滑動、傳送訊息或購買行為，PWA 的使用頻率均超過了原生 app。
• 剛剛提到的 Trivago 利用 PWA 讓用戶把網站加到桌面的比例大幅增加了 150%。
• 共享經濟的代表 Uber 設計的 PWA 即使使用 2G 網路也可以在 3 秒內載入。

如果你從未感受過 PWA，現在可以試著體驗一下（以下用知名旅遊平台 Trivago 做例子）：

1. 打開手機的瀏覽器，網址列輸入 trivago.com
2. 按網頁指示將 trivago.com 加到你的手機桌面
3. 按一下 Trivago 剛新增在桌面的圖示（在打開時會像 app 一樣顯示啟動頁面)
4. 試著隨便瀏覽網站（你會發現用起來跟 app 的感受非常相似）
5. 跳出 Trivago，關掉你的 wifi 和行動數據，再打開 Trivago，有沒有看到一個小遊戲？比起其他網站在離線時只會出現「你並未連結互聯網 / 你無法訪問此網站」，Trivago PWA 設計的離線體驗更周全。