APP三种开发模式--及---HybridApp解决方案_No1_混合模式(Hybrid)App开发概述

APP三种模式：Native App、Web App、Hybrid App。

原文：http://www.cnblogs.com/yeahui/p/5026587.html

1.1.1.     Native App

Native App，原生APP，使用原生（即Android或iOS）开发的APP。两年多以前这非常流行，到现在为止，原生开发人员数量众多，一抓一大票，技术成熟，好多培训机构都抱着老掉牙的API翻来覆去的讲——尤其是Android。Sorry，说错话了……使用原生开发有其优势：应用的性能好，适配起来相对容易。学习成本要看人，个人觉得技术点不多，门槛相对稍高，但入门后学习起来就很轻松——网络资料实在是太多了。

但原生APP最头疼的有三个问题：

1、无法跨平台：Android和iOS都需要开发各自平台的版本——开发成本高；

2、升级麻烦：每次升级都要下载安装包，Android还好，反正不需要审核，下载就下载吧，但iOS就麻烦了，发布每个版本还得经过App Store的审核，这导致第三个问题；

3、Android和iOS很难同步发布。

1.1.2.     Web App

所谓的Web App，就是把手机当做一个浏览器（Android使用WebView，iOS使用UIWebView），做几个页面挂在服务器端，类似于一个小网站。这样说虽然不太贴切，但实际上给人的感觉就是这样的。虽然开发成本大大降低，但页面访问速度慢、操作体验差。于是第三种模式诞生了。

1.2.     Hybrid App所需技术

Hybrid App由于需要保证运行性能与开发速度，需要如下技术支持，本系列博文均会按照Demo的开发顺序依次描述本人的开发心得和教训，希望能起到一个抛砖引玉的作用。

1.2.1.     Native技术

Native技术主要用于提供原生支持，要做到跨平台，就需要掌握部分Android和iOS的知识，除了多线程，文件存储等基础知识，Android需要非常熟练的掌握WebView、WebSettings、WebChromeClient、WebClient四大对象。iOS需要非常熟练掌握UIWebView对象。

1.2.2.     Web技术

1、 HTML5

熟练掌握Html5的各个标签，如何编写最优的文档结构。

2、 CSS

熟练掌握CSS2和CSS3的新特性，能按照效果图编写最高性能的样式。

使用SCSS生成CSS，将CSS可编程化。

3、 JavaScript

实现业务逻辑控制。个人理解JavaScript主要包含两大内容：DOM编程和面向对象编程。大部分JS开发人员就只掌握DOM编程，诸如document.getElementById()等，但面向对象是很重要的一个方面。

4、 性能和开发

模块化编程：编写可复用的组建；

CSS渲染：了解浏览器的CSS渲染引擎才能编写更高效率的样式；

JS解析：了解浏览器的JS解析引擎才能优化JS脚本；

HTTP协议：熟练掌握HTTP请求的各个内容；

AJAX：和服务器端的交互大都采用AJAX。

1.1.3.     Hybrid App

乍一看和Web App没啥差别，但涉及到的技术成本、开发成本、学习成本比Web App高，它综合了Web App的开发速度和Native App的高性能体验。之所以说学习成本高，是因为开发高性能的Hybrid App有难度，网络资料少。我是两年半前开始接触混合模式开发的，当时如何做好屏幕适配、提高UI响应速度、如何最大化使用原生功能等内容，网络几乎没有资料。网上能搜索到的都是很粗略的东西，或者就是Hello World级别的东西，涉及到稍微细节一点的东西几乎没有。由于本系列文章都只讲Hybrid，故在此不再啰嗦了。

三种开发模式各自的特点如下面的表格所示：

	Native App	Hybrid App	Web App
原生功能体验	优秀	接近优秀	差
性能	非常快	快	慢
跨平台开发成本	昂贵	合理	便宜
碎片化适配	非常严重	严重	严重
编程技术支持	短缺	非常短缺	通用人才
版本升级维护	保守	低延时	开放
安全	强	中	弱

1.3.     流行框架

1.3.1.     Hybrid 框架

Cordova/PhoneGap：侧重于JS与原生的交互，开发简单，但性能差，如触摸时反应不灵敏。

AppCan：性能还行，使用简单，但要提交代码给AppCan的服务器才能打包，相信有追求的企业是不会把自己的代码提交给第三方，把打包权利交给第三方的。

Ionic Framework：在Cordova的基础上增加一些UI/JS方面的东西，样式还不错，但同样具有Cordova的不足。

1.3.2.     UI/JS框架

jQuery Mobile：上手简单，组件丰富，但性能超级差，闪屏现象严重。

Senche Touch：简单看过，没有使用过，貌似UI很漂亮，学习成本高。

React Native：FB推出的，当年FB是最早尝试Hybrid的，但性能超差，于是APP放弃了Hybrid，走原生的道路。在大家都不看好H5时，FB暗中深入挖掘H5，三年之后推出了这个框架，非常推荐各位去学习其中的思想。

GMU：百度推出的，这个不错。

1.3.3.     UI/JS库

这个就多了，jQuery、Zepto、Swiper、iScroll、RequireJS、AngularJS……

更多参考文章：http://www.cnblogs.com/bcty365/articles/4685662.html