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

發布時間:2018-04-19 16:36

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 Pay

  7. 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的曆史演變結果,我們將見證這一過程。