另一個應用時代崛起:見證PWA書寫歷史

iOS 上的“超級小程序”蘋果在春天正式推送的 iOS 11.3 帶來了不少重要更新,大家比較熟悉的就是電池管理和關閉降頻功能,不過對於很多關注前端技術和 Web App 的用戶應該注意到了,蘋果 iOS 11.3 已經悄悄加入了對“漸進式 Web 應用”(PWA)這一系列新技術的基本支持。這可能是促進行業發展的一項重要改變,只是蘋果自己並沒有大肆聲張,普通用戶也未必這麼關心。但如果說這項改變的意義,不亞於 6、7 年前我們討論移動 App 擁有多大的潛力,如今,新的 App 發展已經鋪好了道路。PWA,全稱 Progressive Web App,不是特指某一項技術,而是應用了多項技術的 Web App。其核心技術包括 App Manifest、Service Worker、Web Push、Credential Management API ,等等。其核心目標就是提升 Web App 的性能,改善 Web App 的用戶體驗。PWA 所倡導的一些核心技術特性有:可以在主屏幕上創建圖標可以離線運行可以利用後臺線程與服務端通訊對搜索引擎友好響應式界面,支持各種類型的終端和屏幕方便分享,用戶可以方便地把URL地址分享出去簡而言之,PWA 可以通過瀏覽器 Safari 將支持網頁或者網頁服務添加到桌面,生成一個圖標,形成一個 Web App,它和從 App Store 安裝原生 App 相同,點擊圖標即可開啓,不會出現地址欄也不需要你再輸入地址,它還能在離線狀態下使用,原生 App 可以做到的離線使用、消息推送、後臺自動更新等,Web App 通過 PWA 也可以具有類似的能力。而且它還免去了 App 的安裝過程,可以用理解爲一種以瀏覽器爲入口的“小程序”。再說一句大通俗話:你可以將支持的某個網頁直接生成一個 App 放在 iOS 桌面上,並且以後都像打開 App 一樣打開了,以後這種形式還會擴展到更多。PWA 的發展正是這兩年開始的事,蘋果雖然默不作聲但是對 PWA 的發展一直保持着關注,從去年年底開始就不斷有消息預測蘋果 iOS——更確切的說是蘋果 Safari 會支持 PWA,不過我們沒想到它這麼快就來了。PWA 只能在瀏覽器或 Web 平臺的安全和執行模型中運行,所以我們要通過 Safari 來找到:打開 Safari,前去一個支持 PWA 的站點,點擊下方分享圖標,你會發現分享項上有一個“添加到主屏幕”,戳它,點擊確定,主屏幕上就會出現一個長得跟原生 App 很像的 App 圖標(有些已經推出獨立 App 的會在角標上註明網頁版)。

以後你但凡需要到這個網頁,只要點開這個 App 圖標就完事了,不用通過 Safari,它的啓動和原生 App 的速度一樣快,而且最大的優點是可以在網絡很不好的情況下流暢地開啓和使用。是不是感覺,添加 Web App 很像添加 Web 收藏夾?但既然它能夠叫做 App,能做到事情自然還有很多。iOS 平臺上 PWA 的可用能力有1、訪問地理位置2、使用傳感器數據(磁力計、加速計、陀螺儀)3、訪問攝像頭4、音頻輸出5、語音合成(僅限使用耳機的情況)6、調用 Apple Pay7、WebAssembly、WebRTC、WebGL 以及很多帶標籤的實驗性功能PWA 還是小容量 iPhone 用戶的福音,隨着谷歌地圖、微軟翻譯等引擎網站和京東等電商網站都支持 PWA 之後,我們手機中有大量的應用可以轉爲 PWA 代替,不用再從 App Store 下載動輒幾百 M 大小的應用,直接用幾十 M 的 Web App 取代即可。大量內容商們也可以從原生 App 的開發和維護中解脫出來,做一個 PWA 就搞定,還不用通過 App Store 磨人的上架審覈。這種形式同時也很適合商家、企業對內對外的一些移動服務管理。iOS 端 PWA 纔剛剛起步,目前體驗起來只能說相當原始,前面講了,除了少數 API 調用以外,它就跟加了個收藏夾那麼弱雞,不能保持後臺,每次退出都要重新打開,另外它還有很多暫時實現不了的功能(但是別的平臺比如 Android 端大部分都實現了)。

iOS 平臺 PWA 暫時實現不了的功能有1、Web App 可以存儲脫機數據,但是文件大小上限爲 50 Mb。2、目前還未開放功能:藍牙、序列號、Beacon 信標、Touch ID、Face ID、ARKit、高度計、電池信息等等。3、如果用戶長時間內沒有使用某個 Web App,iOS 自動對其進行清空。應用圖標依然會顯示在主屏上,但是需要重新下載數據。4、無法訪問私有信息(聯繫人、後臺定位),也無法訪問原生社交應用。5、不能進行應用內付款。6、在 iPad 上,無法與其他應用使用側拉或分屏顯示,始終佔據整個屏幕。7、無推送通知,無圖標標記,無法與 Siri 集成。蘋果對 PWA 的態度也還很微妙,支持是支持了,給予的權限和接口都非常少,隨着 PWA 本身越來越被看重,包括蘋果也已經在致力着桌面端和移動端相統合,而 PWA 可以說是其中的一個關鍵,相信他們會展現更開放的態度。至少現在,我們已經可以在 Android、Windows、iOS 幾大系統上認識和使用 PWA 了,這個“超級小程序”今後前景可能比我們現在想象的更加寬廣。Web 體驗突破之年早在 10 年前,蘋果就已經在尋找一種基於瀏覽器上開發應用的方法,那個時候,App Store 都還沒有被設計出來。蘋果前 CEO 史蒂夫·喬布斯 2007 年 WWDC 上提出了爲初代 iPhone 開發應用的概念,當時所公佈的,就是 Web App——可以從主屏直接啓動的 Web 應用。可惜當時這個理念沒有引發太大關注,反而是後來原生 SDK 的 App 應用蓬勃發展起來,互聯網公司更願意投入人力在原生 App 的開發上,而忽略了 Web。因此對原生 App 大量的需求出現,佔據了移動時代的主流地位,Web 似乎就要被 App 所取代。然而 Web 一直沒有放棄努力,早在 2014 年, W3C 公佈就公佈過 Service Worker 的相關草案,其生產環境在 2015 年被 Chrome 支持,隨後 PWA 得到了完善。自 2015 年以來,PWA 相關的技術不斷升級優化,在用戶體驗和用戶留存兩方面都提供了非常好的解決方案。PWA 可以將 Web 和 App 各自的優勢融合在一起:漸進式、可響應、可離線、實現類似 App 的交互、即時更新、安全、可以被搜索引擎檢索、可推送、可安裝、可鏈接。

對於原生 App 來說最大的痛點是由於其天生封閉的基因,內容無法被索引,相對於原生 App 的封閉,PWA 卻是完全開放的——PWA 現有的所有技術都是遵循 W3C 的標準,完全開放,因此能夠快速被站點接受、被瀏覽器快速支持。而隨着移動互聯網的發展,用戶下載 App 的熱情也逐漸減弱,積極探索新 App 已經成爲過去式了,80% 的用戶的 80% 的時間被少量超級 App 佔據,原生 App 的分發成本將越來越高。可以說原生 App 的發展肯定會遭遇瓶頸,並且這幾年正在接近這個瓶頸,Web 看到了自己的機遇,PWA 以及支撐 PWA 的一系列關鍵技術應運而生。除了蘋果 Safari 是陣營新丁之外,各家瀏覽器廠商從 2017 年開始大力支持 PWA,主流瀏覽器基本上 PWA 已經支持得很好了,不如說瀏覽器廠商們唯恐自己沒跟上標準而被淘汰。全世界很多大站點也已經跟上步伐,紛紛支持 PWA。

 

到眼下的 2018 年,全球頂級瀏覽器廠商,Google、Microsoft、Apple 已經全數宣佈支持 PWA 技術,這預示着,移動端 App 將會迎來全新的 Web 時代,以後對 PWA 的需求還會大量增加。當然,PWA 不會殺死原生 App,這個問題我們之前和大家討論微信小程序的時候就已經談過,PWA 會前所未有地擴展 App 的外延,也不可避免的改變現有的 App 理念,打破獨立封閉原生的界限,讓更多來自外圍的“App 們”(包括 PWA,也包括小程序)同臺競技,讓用戶在桌面端和移動端上體驗到更少割裂感,更強的關聯性,更強大的搜索和牽引,更快速地獲取到一切你所想要的,這纔像真正的未來 App。有希望的土地才百花盛開前面我們拿了“小程序”來作對比,又說了 PWA 的前景,其實微信小程序(還有支付寶小程序等)就是 PWA 技術應用的一個範例。只不過廣義標準的 PWA 支持更大平臺——Web,而小程序們更依託於它們各自的平臺。從微信小程序發展了一年多然而並沒有涼,我們就可以看出小程序背後的需求能力,當然也可以說是對 PWA 的需求。根據騰訊提供的數據,小程序連接着 10 億用戶與 200 多個類目的商家,目前已經擁有 1.7 億日活用戶、上線 58 萬個小程序、吸引了超過 100 萬個開發者、2300 個第三方開發平臺加入。2018 年,微信小程序還將有一個野心勃勃的計劃:將支持各個 App 直接打開小程序。

你沒有聽錯,簡單來說,在不久以後,所有的 App 裏面都可以看到小程序的身影。這是一個大設計,將把微信打造成全面串聯移動端應用的一個港口,同時又讓各個 App 之間,有了一道便捷的傳送門。這個門不再是諸如 App Store 和 Google Play 這樣的應用商店,而是通過小程序,無限遠和無限多地跳轉。比如,用戶在使用旅行攻略 App,會需要訂機票、酒店、打車等服務,有時候一個 App 可能不能全包括,按照現在的技術就要重新下載一個 App 來查看其他項目。但如果以後 App 可以打開小程序,那麼不需要退出也不需要去應用商店找,小程序就能幫你解決。這無疑是一種生態上的破壁,也應該是 App 的歷史演變結果,我們將見證這一過程。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章