前端工程师的新选择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-----