Day2-PWA 初體驗 - PWA 特色

前言

這一篇將會來介紹如何開啟 PWA 的特色。

PWA 特色

在前一篇講了一大推東西，雖然也有一些範例，但是你可能會想問到底 PWA 的特色是什麼?相信在前面你應該已經有所感受到部分，所以我就列出 PWA 主要特色吧~

其中 PWA 最主要特色有三種 (第三個我是直接丟 Google 翻譯，但其他文本是翻黏性) ↓

• Reliable (可靠)
• Fast (快速)
• Engaging (參與)

Reliable

Reliable 的意思是說，就算使用者處於網路連線較差的狀況下也可以達到加載網頁的能力，而這功能最主要仰賴於 Service Worker (後面在介紹)。

一般我們手機某些 APP 在網路不順暢或者開啟飛航模式時，也都可以很快速地開啟 or 運作，那麼 PWA 就是也有支援這一個強大的功能，也就是離線緩存，在網路不順暢或是沒有網路的狀況下，我們可以透過緩存來正常運行 Web。

所以這也是 PWA 最大特色之一。

Fast

在畫面切換上會非常的流暢順暢，而且也會有良好的 APP 開啟啟動頁面。

Engaging

最後是 Engaging，那 Engaging 呢?其實我覺得 Engaging 最主要意思是想要傳達更接近原生 APP。

Engaging 最主要可以分為這三種

• PWA 是屬於一種可以安裝的 APP，只需要透過瀏覽器添加到主畫面就可以達到，完全不用進入商店下載 APP。
• PWA 可以讓使用者感受到就像 Native App 的操作。
• PWA 最特別的地方就是可以發送離線推播進而達到使用者回流的效果。

其他

其他這部分我就直接引用 it邦鐵人賽之前前輩所撰寫的文章就很詳細了。

- Progressive
  - 漸進式，提供每一位用戶做基本的瀏覽，若支援環境、可以提供更強大的功能。
- Responsive
  - 響應式的用戶介面，可以在不同裝置下作最佳化的顯示。
- Connectivity independent
  - 不依賴網路連接，透過 service workers 可以在低頻寬甚至是離線的環境下瀏覽網站。
- App-like
  - 讓網站可以具有像 APP 般的瀏覽速度等優點，提供更佳的用戶體驗。
- Fresh
  - 藉由 service worker 自動更新網站內容。
- Safe
  - 通過 HTTPS 來提供服務，確保資料安全性。
- Discoverable
  - 能夠執行 SEO 優化，讓使用者快速找到網站，增加網站經營成效。
- Re-engageable
  - 像是推播通知等特性，吸引使用者注意、主動和使用者互動，提升用戶回流率。
- Installable
  - 可以藉由 Add To Home，如同 App，會新增一個 icon，可以直接將網站加到手機桌面上做切換使用，不需要再透過 App Store 下載安裝。
- Linkable
  - 可以將網站、透過 URL 相互傳遞分享。

以上來自 Day 03 - 30 天 Progressive Web App 學習筆記 - 什麼是 PWA?

參考文獻

你的首個 Progressive Web App

Day 03 - 30 天 Progressive Web App 學習筆記 - 什麼是 PWA?