Progressive Web App, 簡稱 PWA，是提升 Web App 的體驗的一種新方法，能給使用者原生應用的體驗。
PWA 能做到原生應用的體驗不是靠特指某一項技術，而是經過應用一些新技術進行改進，在安全、效能和體驗三個方面都有很大提升，PWA 本質上是 Web App，藉助一些新技術也具備了 Native App 的一些特性，兼具 Web App 和 Native App 的優點。
PWA 的主要特點包括下面三點：
- 可靠 - 即使在不穩定的網路環境下，也能瞬間載入並展現
- 體驗 - 快速響應，並且有平滑的動畫響應使用者的操作
- 粘性 - 像裝置上的原生應用，具有沉浸式的使用者體驗，使用者可以新增到桌面
可靠
通過 Service Worker 能夠讓使用者在網路條件很差或離線的情況下也能瞬間載入並且展現。
介紹個sw的簡便實現方法 offline-plugin
// webpack.config.js
var OfflinePlugin = require('offline-plugin');
module.exports = {
plugins: [
new OfflinePlugin({
Caches: 'all'
})
]
}
//index.js
import * as OfflinePluginRuntime from 'offline-plugin/runtime';
OfflinePluginRuntime.install();
複製程式碼體驗
首屏載入優化 App Shell
粘性
- 藉助 Web App Manifest 提供給使用者和 Native App 一樣的沉浸式體驗
- 可以通過給使用者傳送離線通知，讓使用者迴流