前端工程師的新選擇WebApp

做爲新一代移動端應用分發入口，小程序的趨勢明朗化，競爭也在急劇激烈化。戰線從手機 QQ、QQ 瀏覽器、支付寶、手機淘寶，華爲，小米等九家手機廠商推出「快應用」，再拉到了谷歌的 Instant App 和 PWA、Facebook 的 React Native。一場圍繞webapp關鍵戰役已經全面打響。那是否是webapp就要替代原生app，webapp要爆發了，我相信不少人都有這樣的疑問，特別是從事web開發工做。

如今主流的開發模式，Native App（原生模式）、Web App（html5 app）和Hybrid App（混合開發）。

Native App開發

Native App開發即咱們所稱的傳統APP開發模式（原生APP開發模式），該開發針對IOS、Android等不一樣的手機操做系統要採用不一樣的語言和框架進行開發，該模式一般是由「雲服務器數據+APP應用客戶端」兩部份構成，APP應用全部的UI元素、數據內容、邏輯框架均安裝在手機終端上。 Native App能夠類比Client/Server結構(C/S結構)，也就是是你們熟知的客戶機和服務器結構。經過C/S結構也能夠充分利用兩端硬件環境的優點，將任務合理分配到Client端和Server端來實現，下降了系統的通信開銷。

Web App開發

Web App開發便是一種框架型APP開發模式（HTML5 APP 框架開發模式），該開發具備跨平臺的優點，該模式一般由「HTML5雲網站+APP應用客戶端」兩部份構成，APP應用客戶端只需安裝應用的框架部份，而應用的數據則是每次打開APP的時候，去雲端取數據呈現給手機用戶。 Web App能夠類比你們熟知的B/S結構，將系統功能實現的核心部分集中到服務器上，簡化了系統的開發、維護和使用。

Hybrid App

Hybrid App（混合模式移動應用）是指介於web-app、native-app這二者之間的app，兼具「Native App良好用戶交互體驗的優點」和「Web App跨平臺開發的優點」。 這就像C/S與B/S結合產生的CB/S模式，將B/S與C/S的優點完美地結合起來，應用系統既能以B/S的方式發佈運行，同時又具備C/S方式的極強的可操做性。

Native APP開與Web APP開發對比

Web APP（嵌入型APP），Web App 指採用Html5語言寫出的App，不須要下載安裝。相似於如今所說的輕應用。生存在瀏覽器中的應用，基本上能夠說是觸屏版的網頁應用。

優勢

（1）開發成本低，

（2）更新快，

（3）更新無需通知用戶，不須要手動升級

（4）可以跨多個平臺和終端。

缺點

（1）臨時性的入口

（2）沒法獲取系統級別的通知，提醒，動效等等

（3）用戶留存率低

（4）設計受限制諸多

（5）體驗較差

Native App（原生型APP），Native APP 指的是原生程序，通常依託於操做系統，有很強的交互，是一個完整的App，可拓展性強。須要用戶下載安裝使用。

優勢

（1）打造完美的用戶體驗

（2）性能穩定

（3）操做速度快，上手流暢

（4）訪問本地資源（通信錄，相冊）

（5）設計出色的動效，轉場，

（6）擁有系統級別的貼心通知或提醒

（7）用戶留存率高

缺點

（1）分發成本高（不一樣平臺有不一樣的開發語言和界面適配）

（2）維護成本高（例如一款App已更新至V5版本，但仍有用戶在使用V2， V3， V4版本，須要更多的開發人員維護以前的版本）

（3）更新緩慢，根據不一樣平臺，提交–審覈–上線 等等不一樣的流程，須要通過的流程較複雜

在PC時代，桌面上你們和外界互通的入口，其實基本是瀏覽器。PC時代的Web，已經知足了你們一切非移動特性上的互聯網需求，但隨着移動互聯網的技術發展，IOS和Android手機迅速佔領你們的平常生活，而移動互聯網同時帶來了另外一個新的東西，叫作Native App（原生應用，簡稱NA），衆多NA知足了你們在手機上的需求，並快速覆蓋了各類互聯網垂直行業。在此過程當中也有極少數超級NA佔據了移動互聯網的半壁江山。

移動互聯網操做系統的技術生態同時也改變了Web，在手機上，Web再也不是惟一的互聯網入口，你們經過在桌面上放置五花八門的APP來知足平常的需求。移動互聯網也讓PC時代的Web再也不那麼風光，潛移默化的，你們也都使用開發NA而不是開發Web頁面的方式來服務用戶了。

那爲何衆多開發者會以爲如今移動互聯網的Web頁面很差呢？緣由總結以下： 1.手機桌面入口不夠便捷； 2.沒網絡就沒響應，不具有離線能力； 3.不像APP同樣能進行消息推送。 除此以外，做爲前端碼農的我也發現衆多Web開發者都是PC時代轉行的，移動互聯網手機的特性，要求了你們須要寫更好的代碼，才能作好一個Web頁面，也就是咱們所說的Web App。

Web App會好嗎？ 我想回答：Web App會好。 讓咱們再回顧一下以前所講述，咱們先論述了爲何有人以爲小程序好，這裏獲得的結論是拋除微信自己的能力，小程序好的緣由實際上是由於它具有了幾個Web頁面的關鍵特性（無需安裝下載、用完即走），其次咱們也講述了爲何現階段的Web App不夠好，一方面是由於Web缺乏了一部分NA的能力（離線，桌面入口，消息推送），另外一方面是由於Web的開發者（特別是國內的）綜合能力欠缺，缺少具有開發一個好的Web App的能力。

那基於以上的回顧，咱們發現Web App能夠變得更好。個人感受就像開頭所說同樣：隨着各大互聯網平臺發力基於Html5 Web的應用，咱們發現對Web App的支持愈來愈接近原生，包括： 1. 離線緩存 2. 添加到主屏 3. 消息推送 基於以上能力，一個Web App基本上能夠媲美一個Native App，同時，它還具有了咱們渴望的特性： 1. 無需安裝 2. 用完即走 很激動有木有！！ 贅述了這麼多，咱們回顧本文的標題，也是一開始留下的問題： 問：前端工程師的新選擇？ 答：確定的！咱們可使用開發的、標準的Web解決方案， Web App的將來，它是開放的、不封閉的，它能夠作的更好，也許比原生的還要出色！

-----end-----