WEB APP、HYBRID APP与NATIVE APP的差异

目前主流应用程序大体分为三类：Web App、Hybrid App、 Native App。

一、Web App、Hybrid App、Native App 纵向对比

首先，我们来看看什么是 Web App、Hybrid App、 Native App。

1. Web APP

Web App 指采用Html5语言写出的App，不需要下载安装。类似于现在所说的轻应用。生存在浏览器中的应用，基本上可以说是触屏版的网页应用。

优点：

（1）开发成本低，
（2）更新快，
（3）更新无需通知用户，不需要手动升级，
（4）能够跨多个平台和终端。

缺点：

（1）临时性的入口
（2）无法获取系统级别的通知，提醒，动效等等
（3）用户留存率低
（4）设计受限制诸多
（5）体验较差

2. Hybrid App

Hybrid APP指的是半原生半Web的混合类App。需要下载安装，看上去类似Native App，但只有很少的UI Web View，访问的内容是 Web 。

例如Store里的新闻类APP，视频类APP普遍采取的是Native的框架，Web的内容。

Hybrid App 极力去打造类似于Native App 的体验，但仍受限于技术，网速，等等很多因素。尚不完美。

3. Native App

Native APP 指的是原生程序，一般依托于操作系统，有很强的交互，是一个完整的App，可拓展性强。需要用户下载安装使用。

优点：

（1）打造完美的用户体验
（2）性能稳定
（3）操作速度快，上手流畅
（4）访问本地资源（通讯录，相册）
（5）设计出色的动效，转场，
（6）拥有系统级别的贴心通知或提醒
（7）用户留存率高

缺点：

（1）分发成本高（不同平台有不同的开发语言和界面适配）
（2）维护成本高（例如一款App已更新至V5版本，但仍有用户在使用V2， V3， V4版本，需要更多的开发人员维护之前的版本）
（3）更新缓慢，根据不同平台，提交–审核–上线 等等不同的流程，需要经过的流程较复杂

二、Web App、Hybrid App、Native App 技术特性

由上图可见，Web APP 的开发基于Html5语言。而Html5语言本身又有着不可避免的局限性。正是这些局限性的存在，使得Web App在体验中要逊于Native App。

三、weex和react native

weex

weex是阿里巴巴公司与2016年6月开源的一种用于构建移动跨平台的UI框架

特点:

1.Lightweight:轻量级,语法简单,易于使用
2.Extendable:可扩展,丰富内置组件,可扩展的API,
3.High Performance:高性能

核心理念:

Write Once Run Everywhere

基于JS开发框架:

weex基于vue.js

React Native

Facebook在2015年3月在F8开发者大会上开源的跨平台UI框架
核心理念:LEARN ONCE, WRITE ANYWHERE

基于JS开发框架:

React Native基于React

知识拓展:vue.js和React

Vue:

是一个构建数据驱动的 web 界面的库。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.

React:

基于HTML的前端界面开发正变得越来越复杂，其本质问题基本都可以归结于如何将来自于服务器端或者用户输入的动态数据高效的反映到复杂的用户界面上。而来自Facebook的React框架正是完全面向此问题的一个解决方案，按官网描述，其出发点为：用于开发数据不断变化的大型应用程序。相比传统型的前端开发，React开辟了一个相当另类的途径，实现了前端界面的高效率高性能开发。

Weex和React Native的异同

相同点:

• 都采用Web的开发模式，使用JS开发；
• 都可以直接在Chrome中调试JS代码；
• 都支持跨平台的开发；
• 都可以实现hot reload，边更新代码边查看效果；

不同点:

• JS引擎
• 学习成本
  1.环境配置：
  ReactNative需要按照文档安装配置很多依赖的工具，相对比较麻烦。 weex安装cli之后就可以使用
  2.vue vs react:上面已经做过对比
  react模板JSX学习使用有一定的成本 vue更接近常用的web开发方式，模板就是普通的html，数据绑定使用mustache风格，样式直接使用css
• 社区支持
  Weex开源较晚，互联网上相关资料还比较少，社区规模较小；
  React Native社区则比较活跃，可以参考的项目和资料也比较丰富