[TOC]
# Native App、Web App 还是Hybrid App?
## 一、什么是Native App?
Native App即原生应用,即我们一般所称的客户端,是针对不同手机系统单独开发的本地应用,如需使用需要先下载到手机并安装,下载Native App的最常见方法是访问应用程序商店,如苹果的App Store、安卓市场、Google Play等。在技术实现上一般采用针对操作系统的特定语言进行编写,如:使用Objective-c开发IOS应用,使用Java+Android开发android应用。
Native App的优点:
* 可以在应用商店轻易地找到并且能在手机主屏幕上生成相应的图标
* 可以利用系统API及平台特性,访问手机的提供的功能(GPS,相机等)
* 可访问本地资源,支持离线工作,节省用户的流量成本
* 可针对不同平台提供不同的体验,针对平台特性去做用户体验优化
* 与系统高度切合,可获得更快的运行速度和性能,并支持丰富的图形和动画。
Native App的缺点:
* 开发成本高,需要针对不同平台需要不同的技术背景进行开发
* 维护成本高,用户必须手动下载更新,历史版本又不能不维护
* 未知的上线时间,需要通过应用商店的审核
Native App最大的优势就是可以使用操作系统开发商提供的API。这些API可以分为两大类:低级API和高级API。
低级API:应用程序能直接与触摸屏或键盘进行联系、渲染图形、连接至网络、处理从麦克风收到的音频、通过扬声器或麦克风播放声音,或者接收来自摄像头的图像或视频。应用程序能访问全球定位系统(GPS)、接收方位信息,当然还可以读写固态硬盘上的文件,或者访问现有和将来会有的其他任何硬件元件。
高级API:提供对个人移动体验来说很重要的较高级服务,这类服务包括浏览Web,管理日历、联系人资料和相册等,当然还包括打电话或收发文本消息的功能。
操作系统提供的另一组重要的API是GUI工具包。每一种移动操作系统都随带各自的一组用户界面组件,比如按钮、输入区、滑块、菜单、菜单栏、对话框及其他。可以使用这些组件的应用程序继承了该特定移动操作系统的外观和感觉,通常会带来非常流畅的用户体验。
## 二、什么是Web App?
Web App又叫Web应用,简单的说就是一个触屏版的网站。Web应用完全用HTML、JavaScript和CSS等Web技术开发,通过移动设备的浏览器来访问,缺点是这些基于浏览器的应用无法调用系统API来实现一些高级功能,也不适合高性能要求的场合。
Web App的优点:
* 开发成本低,使用现有的Web开发技术即可
* 适用范围广,覆盖所有智能手机,跨平台和终端
* 方便、快捷地部署,无需用户安装
* 用户总能访问到最新版本,迭代更新容易
* 可被搜索引擎收录并带来流量
Web App的缺点:
* 浏览体验短期内还无法超越原生应用
* 不支持离线模式(HTML5将会解决这个问题)
* 消息推送不够及时
* 调用本地文件系统的能力弱
* 较差的和较慢的性能体验(大部分需要链接互联网)
* 支持图形和动画效果较差
* 不适用于应用商店及没有靠下载应用盈利机会
* 限制用户使用功能(比如,相机、GPS等)
移动Web App是一种很有希望的趋势。为了紧紧抓住这个趋势,帮助开发者构建客户端用户界面,已开发出越来越多的JavaScript工具包,比如Sencha Touch和jQuery Mobile,它们创建的用户界面在外观和感觉上与Native App大同小异。两者都完全在移动设备的浏览器里面执行,充分利用了现代移动浏览器所提供的最新JavaScript、CSS和HTML5特性。
## 三、什么是Hybrid App?
Hybrid App又叫混合应用,是一种介于Native App、Web App之间的App,**它虽然看上去是一个Native App,但只是一个UI WebView,里面访问的是一个Web App**。Hybrid App实质是伪造一个浏览器的apk/ipa原生程序,并运行了一个Web APP。Hybrid App兼具“Native App良好用户交互体验的优势”和“Web App跨平台开发的优势”。它可以使web开发人员可以几乎零成本的转型成移动应用开发者,并且相同的代码只需针对不同平台进行编译就能实现在多平台的分发,而相较于Web App,开发者可以通过包装好的接口,调用大部分常用的系统API。
Hybrid App的优点:
* 支持多平台访问
* 手机功能都可访问
* 适用于应用商店
* 部分支持离线功能
* Hybrid App的缺点:
* 未知的部署时间
* 用户体验不如本地应用
* 性能速度较慢(需链接网络)
* 该技术尚未发展成熟,依然是一门新技术
Hybrid开发方法结合了Native开发和Web技术。借助这种方法,开发者就能使用跨平台Web技术,开发应用程序的大部分代码,又可以在需要时直接访问Native API。App的Native代码部分使用操作系统的API来创建嵌入式HTML渲染引擎,该引擎在浏览器和设备的API之间充当了桥梁。这座桥梁让Hybrid App得以充分利用现代设备所提供的全部特性。App的Web部分可能是驻留在服务器上的网页,也可能是一组HTML、JavaScript、CSS和媒体文件,封装到App代码中,存储在设备本地。放置在服务器上的HTML代码让开发者不必经历提交和批准过程,把Web代码封装到App里面可以提高性能和可访问性。
如果企业使用Hybrid开发方法,就能集两者之所长。一方面,Native让开发者可以充分利用现代移动设备所提供的全部不同的特性和功能。另一方面,使用Web语言编写的所有代码都可以在不同的移动平台之间共享,使得开发和日常维护过程变得集中式、更简短、更经济高效。
Hybrid App(混合模式移动应用)兼具“Native App良好用户交互体验的优势”和“Web App跨平台开发的优势”。很多人不知道市场上一些主流移动应用都是基于Hybrid App的方式开发,比如工商银行、百度搜索、街旁、东方航空等。
Hybrid App通常是基于第三方跨平台移动应用引擎框架进行开发,在国内开发者中比较知名的有PhoneGap、Titanium和AppCan这些引擎框架一般使用HTML5和Javascript作为编程语言,调用引擎封装的底层功能如照相机、传感器、通讯录、二维码等。HTML5和Javascript只是作为一种解析语言,真正调用的都是Native App一样封装的底层功能,这是和Web App的最大区别和不同。因为使用了浏览器技术,所以Hybrid App通常具有跨平台的特性,并且开发成本和Web App接近,开发效率也远高于Native App。
很多企业采用Hybrid App技术开发移动应用,一方面是开发简单,另外一方面可以形成一种开发的标准。企业封装大量的Native Plugin(原生插件如支付功能插件)供Javascript调用,并且可以在今后的项目中尽可能的复用,从而大幅降低开发时间和成本。Hybrid App的标准化给企业移动应用开发、维护、更新都带来了极高的便捷性。
## 四、Native App、Web App和Hybrid App的比较
![](https://box.kancloud.cn/5a745fbcb537a03878c4b3bf587dd609_539x344.png)
Native开发方法在性能和设备访问方面很出色,但成本和更新方面有缺点。Web方法更新起来简单得多,成本较低,也更容易,但是目前功能有限,也无法获得使用Native API调用所能获得的那种出色的用户体验。Hybrid开发方法提供了折中方案:在许多情况下,它集两者之所长,如果开发者面向多种操作系统更是如此。
![](https://box.kancloud.cn/2015-12-27_567fed08080dd.png)
![](https://box.kancloud.cn/f3783a36933bfb8c825e75fda728c9f7_472x354.png)
从上面的表格中可以看出,没有哪一种开发方法总是提供所有的优点。每一种开发方法有天生的局限性,没有哪一种方法能够满足现代移动企业的所有要求、应对复杂情况。选择一种合适的方法取决于企业的具体要求,可能取决于诸多因素,比如预算、时间表、内部资源、目标市场、所需的应用程序功能、IT基础设施及其他许多方面。但是有一点很清楚:如今的大多数公司显然在两个方面之间作取舍:一是用户体验和应用程序功能,另一是开发成本和产品上市时间。问题就变成了选择一种合适的开发方法,能兼顾企业的要求和其在预算和产品上市时间方面的限制。
>码字很辛苦,转载请注明来自标点符的《Native App、Web App 还是Hybrid App?》
- 前言
- 中文字体
- 移动Web适配方案
- !移动Web基础!
- 详解适配相关概念
- 移动开发之设计稿
- 移动适配方案(一)
- 移动适配方案(二)
- vw+rem 实现移动端布局
- 移动端适配之雪碧图(sprite)背景图片定位
- 适配 iPhoneX
- 前端开发实战
- 打造自己的前端开发流程(Gulp)
- flexible.js案例讲解
- viewport 与 flexible.js解读
- 图片与字体
- 踩过的坑
- 浏览器默认样式
- 300ms点击延迟和点击穿透
- ios css
- CSS 常见问题
- Ionic v1混合开发
- Native App、Web App 、Hybrid App?
- ionic项目结构
- 混淆加密
- 解决问题
- cordova
- 环境配置
- 打包发布
- 问题
- 移动前端开发优化
- Web开发之抓包
- ===web移动开发资源===
- H5组件框架
- 调试集合
- 简单h5调试
- whistle
- devtools-pro