Progressive Web Apps,簡稱PWA，中文翻譯過來就是漸進式網頁應用，個人覺得它可以算是Web應用的下一個進化方向之一， 畢竟技術的發展有時候是不可預估的，誰也無法預料技術的走向，但至少它代表了一種可能性，下面我們就一起來了解下這種新興技術。

以下僅代表個人見解和認知，有結合其他大神的文章的分析，如有不足之處歡迎指正！

?一、什么是Progressive Web Apps??

Progressive Web Apps，簡稱PWA，中文直譯過來就是漸進式Web應用，一個合格的PWA，應該具有但不限于以下特點：

?漸進式：針對不同版本不同內核的瀏覽器，它的功能能夠漸進式的增強，隨著用戶與應用之間的聯系加深，如果用戶需要，網頁可以漸進式地變成App，比如被添加到主屏幕、全屏方式運行、離線工作、推送通知消息等。但它仍是 Web 而非放到 App Store 里。

響應式：適應多種運行環境，無論是移動端、web端還是平板電腦等等。

對網絡環境的弱依賴： 得益于谷歌的service worker技術，使PWA極大降低對網絡環境的依賴，能夠在離線或者網絡極差的環境下工作。

持續更新：同樣由于service worker的存在，應用能夠輕松實現持續更新。

類原生體驗：有像原生應用般的交互和導航給用戶原生應用般的體驗，如果用戶愿意，特悶可以選擇將PWA應用添加到手機主屏幕，同樣得益于service worker，它甚至可以讓PWA應用像原生應用一樣接收消息推送。

安全：通過 HTTPS 來提供服務來防止網絡窺探，保證內容不被篡改。

二、我個人對PWA的一些認知

以上對PWA的一些定義，都是一些官方的定義或者一些大神的認知，下面來談談我個人對PWA的一些認知，以及它和目前的Hybrid App、小程序、快應用的區別。

目前市場上主流的Hybrid App無非兩種做法：

1.類似React Native這種，通過JavaScript語言進行開發，視覺上通過標簽轉義，將RN標簽轉化為手機原生圖形界面；操作上通過js調用手機底層硬件和SDK；這種做法的優點是APP體驗好，缺點是開發周期幾乎和原生APP差不多

2.國內外很多中小企業比較青睞的H5頁面套APP外殼的做法，例如國內的APICloud、H5plus等等，其本質上只是一個可以訪問特定H5頁面的瀏覽器；這種做法的優點是開發周期短，缺點是體驗和性能都較差。

而小程序和快應用，個人認為更多的是借鑒React Native的思路進行實現的，尤其是微信小程序，基本上就是沿用了RN的那一套。

那么PWA和以上幾種應用的區別在哪里呢？有些人可能會覺得PWA和小程序以及快應用幾乎沒什么區別，但在我看來，PWA和小程序、快應用、混合APP這些東西天生就不一樣！

還記得PWA的全名嗎？Progressive Web Apps，這里已經寫得很明確了，它是Web App啊，React Native、小程序、快應用一直在致力于去HTML化，雖然他們都是使用JavaScript作為開發語言進行編寫的，但是你要知道，JavaScript本就不是只為HTML而生的，如果你有閱讀過相關書籍你就會知道，JavaScript其實可以在瀏覽器以外的環境下運行！

以上其它應用，基本都已經摒棄了HTML中除了JS以外的其它內容，但是PWA不一樣，它從骨子里仍然是一個Web頁面！說到Web App,有些同學可能會嗤之以鼻，確實，當前市場下，Web App也就是移動端Web頁面的份額已經極大化的萎縮（下圖是google發布的移動Web和App使用時長占比），或者說Web App可能從來沒有輝煌過，從傳統電腦端轉移到智能手機時代，中間的過渡其實非常短，相信這點大家都是感同身受的，但是現在，誰也說不準Web App是否來到了一個風口位置 -- 因為有了PWA，你訪問的Web頁面已經有了能夠媲美原生App的體驗！

三、PWA將如何改變我們的移動體驗？

當你在手機瀏覽器中打開一些Web網頁時，經常會看到以下的頁面:

這些Web App會推薦你打開它們的原生應用，如果你的手機沒有下載則會跳轉到相應的下載頁面，但是對于用戶來講，在沒有WIFI的情況下可能并不想為了一個不常用到的App消耗流量和系統內存，或者手機容量比較吃緊的用戶，可能有時候會為了刪除哪些應用保留哪些應用而猶豫不決，現在有了PWA，一切都能迎刃而解！而這些，還不是全部！

在2016年11月google團隊已經在嘗試并初步實現把「添加至主屏」重命名為「安裝」，被安裝的 PWA 不再僅以 widget 的形式顯示在桌面上，而是真正做到與所有原生應用平級，一樣被收納進應用抽屜（App Drawer）里，一樣出現在系統設置中。

PWA能夠獲得和原生APP同級的權限，也能夠像原生APP一樣實時獲取推送消息，即使你在以后想要刪掉這個PWA應用，你也依然可以在瀏覽器中獲得高質量高體驗的Web頁面，在Web端，甚至Mac環境下也能享受到這種體驗！

四、案例欣賞

國內外有一些優秀的技術團隊已經開始嘗試并推出了一些不錯的PWA應用，我這里簡單介紹下兩個已知的

FlipKart(印度)

離線情況下的視覺差異

豆瓣(中國)

更多專業前端知識，請上 【猿2048】www.mk2048.com

總結

以上是生活随笔為你收集整理的浅谈一下我了解的PWA的全部內容，希望文章能夠幫你解決所遇到的問題。

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