移动Web App、Hybrid App与Native App的差异

admin

1. Web APP

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

优点：
开发成本低，
更新快，
更新无需通知用户，不需要手动升级
能够跨多个平台和终端。

缺点：
临时性的入口
无法获取系统级别的通知，提醒，动效等等
用户留存率低
设计受限制诸多
体验较差

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）维护成本高（例如一款App已更新至V5版本，但仍有用户在使用V2， V3， V4版本，需要更多的开发人员维护之前的版本）

（3）更新缓慢，根据不同平台，提交–审核–上线 等等不同的流程，需要经过的流程较复杂

相比Native App，Web App体验中受限于个因素：网络环境，渲染性能，平台特性，受限于浏览器，系统限制。

1. 网络环境，渲染性能

Web APP对网络环境的依赖性较大，因为Web APP中的H5页面，当用户使用时，去服务器请求显示页面。如果此时用户恰巧遇到网速慢，网络不稳定等其他环境时，用户请求页面的效率大打折扣，在用户使 用中会出现不流畅，断断续续的不良感受。同时，H5技术自身渲染性能较弱：对复杂的图形样式，多样的动效，自定义字体等的支持性不强。

因此，基于网络环境和渲染性能的影响，在设计H5页面时，应注意以下几点：

简化不重要的动画/动效
简化复杂的图形文字样式
减少页面渲染的频率和次数

2. 受限于浏览器

通常Web App生存于浏览器里，宿主是浏览器。不同的浏览器自身的属性不尽相同，如：浏览器自带的手势，页面切换方式，链接跳转方式，版本兼容问题等等。

再如，基于浏览器的Web APP在打开新的模块中的页面时，大多会新开窗口来展现。例如用户在使用购物类APP时，浏览每日精选模块时，每当打开新的商品时，默认新开一个窗口。这 样的优劣势显而易见：优势是能够记录用户浏览过的痕迹，浏览过的商品，以便后续横向对比；劣势是过多的页面容易使用户迷失在页面中。

因此，Web App基于浏览器的特性，从设计角度应该遵循以下了两点：

少用手势，避免与浏览器手势冲突。

减少页面跳转次数，尽量在当前页面显示。

3. 系统限制，平台特性

由于Html5语言的技术特性，无法调用系统级别的权限。例如，系统级别的弹窗，系统级别的通知，地理信息，通讯录，语音等等。且与系统的兼容性也会存在一些问题。以上限制通常导致APP的拓展性不强，体验相对较差。

但它们也有相同点，如在测试方面。不管是移动web App还是原生App，都是需要在移动终端上运行的，那么对app 测试的兼容性配适的需求就是一样的。基本上线前，都需要进行app兼容性测试，app功能测试，遍历测试，安全测试等，确保产品质量和用户体验。

TestBird