瀏覽器的三大進化路線：

應用程序Web化
Web應用移動化
Web操作系統化

什么是PWA?

PWA，全稱是 Progressive Web App，漸進式網頁應用.根據字面意思，它就是“漸進式 +Web 應用”。對于 Web 應用很好理解了，就是目前我們普通的 Web 頁面，所以 PWA 所支持的首先是一個 Web 頁面。至于“漸進式”:

站在 Web 應用開發者來說，PWA 提供了一個漸進式的過渡方案，讓普通站點逐步過渡到 Web 應用。采取漸進式可以降低站點改造的代價，使得站點逐步支持各項新技術，而不是一步到位。

站在技術角度來說，PWA 技術也是一個漸進式的演化過程，在技術層面會一點點演進，比如逐漸提供更好的設備特性支持，不斷優化更加流暢的動畫效果，不斷讓頁面的加載速度變得更快，不斷實現本地應用的特性。

PWA定義：它是一套理念，漸進式增強 Web 的優勢，并通過技術手段漸進式縮短和本地應用或者小程序的距離

相對于本地應用，Web頁面缺少什么？

缺少離線使用能力
缺少消息推送的能力
缺少一級入口，也就是將 Web 應用安裝到桌面，在需要的時候直接從桌面打開 Web 應用，而不是每次都需要通過瀏覽器來打開。

針對以上缺陷，PWA的解決方案是什么？

通過引入 Service Worker 來試著解決離線存儲和消息推送的問題
通過引入 manifest.json 來解決一級入口的問題

什么是 Service Worker？

Service Worker的主要思想是在頁面和網絡之間增加一個攔截器，用來緩存和攔截請求。

Web Worker 的功能是什么？

為了避免 JavaScript 過多占用頁面主線程時長的情況，Web Worker 的目的是讓 JavaScript 能夠運行在頁面主線程之外，不過由于 WebWorker 中是沒有當前頁面的 DOM 環境的，所以在 Web Worker 中只能執行一些和DOM 無關的 JavaScript 腳本，并通過 postMessage 方法將執行的結果返回給主線程。所以說在 Chrome 中， Web Worker 其實就是在渲染進程中開啟的一個新線程，它的生命周期是和頁面關聯的

讓其運行在主線程之外”就是 Service Worker 來自 Web Worker 的一個核心思想。

Service Worker的設計思路是什么？

架構

Service Worker 需要在Web Worker 的基礎之上加上儲存功能。另外，由于 Service Worker 還需要會為多個頁面提供服務，所以不能將它和單個頁面綁定起來，因此在目前的Chrome架構中，Service Worker 是運行在瀏覽器進程中的，因為瀏覽器進程生命周期是最長的，所以在瀏覽器的生命周期內，能夠為所有的頁面提供服務

消息推送

消息推送也是基于 Service Worker 來實現的。因為消息推送時，瀏覽器頁面也許并沒有啟動，這時就需要 Service Worker 來接收服務器推送的消息，并將消息通過一定方式展示給用戶。

安全

Service Worker 采用 HTTPS 協議，因為采用 HTTPS 的通信數據都是經過加密的，即便攔截了數據，也無法破解數據內容，而且 HTTPS 還有校驗機制，通信雙方很容易知道數據是否被篡改。

PWA的額外功能還有哪些？

PWA 還提供了 manifest.json 配置文件，可以讓開發者自定義桌面的圖標、顯示名稱、啟動方式等信息，還可以設置啟動畫面、頁面主題顏色等信息。

總結

以上是生活随笔為你收集整理的渐进式网页应用（PWA）：它究竟解决了Web应用的哪些问题？的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。