HTML5 移动应用开发环境搭建及原理分析
开发环境搭建：
一、Android 开发平台搭建
- 安装java jdk：\\10.194.151.132\Mewfile\tmp\ADT
- 配置java jdk
1) 新建系统变量，JAVA_HOME，C:\Program Files\Java\jdk1.8.0_25
2) 新建系统变量，classpath，;%JAVA_HOME%\lib;%JAVA_HOME%\lib\tools.jar
3) Path，%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin
4) 测试，javac
- 安装Apache Ant
- 配置Apache Ant
1) 新建系统变量，ANT_HOME，C:\soft\apache-ant-1.9.4
2) Path，%ANT_HOME%\bin
- 配置Android SDK
将SDK中的tools和platform-tools的路径添加到PATH中
- 创建虚拟机
二、安装Cordova
- 安装Node.js
- 安装cordova：使用Node.js 的npm命令，C:\>npm install -g cordova，确保npm的路径在PATH中存在，如C:\Users\username\AppData\Roaming\npm
- 创建HTML5应用：
cordova create hello com.example.hello HelloWorld
- 添加应用平台：
cd hello
cordova platform add android
- 建立APP：
cordova build
- 在虚拟机中测试创建的APP
cordova emulate android
三、安装HBuilder（非必要）
- 安装HBuilder
- 导入Cordova生成的HTML5应用文件
- 修改代码，使用cordova emulate android在虚拟机中调试。
HTML5移动应用原理分析
HTML5移动应用开发框架诸如Cordova，Ionic，HBuilder等，在编译生成移动应用的时候主要做两件事：
- 集成WebView组件和浏览器；
- 打包包含web应用程序文件的一系列资源。
即基于平台上自带的Web引擎，html5移动应用通过系统API，调用系统浏览器的加速引擎来加载页面：iOS可以调用UIWebview利用加速引擎Nitro加速，这样可以在前端使用JavaScript做大型运算；Android4.4之后，内置的Webview也由Android WebKit换成了Chromium，性能大幅提升。
上述HTML5移动应用开发框架的主要不足在于功能和性能方面，这主要是因为HTML5应用的能力严重依赖于系统自带的Web引擎：iOS的UIWebview、Android的Webview等，此类组件的HTML5能力相比Safari for iOS、Chrome for Android都要差一截。另外在Android平台上，由于系统碎片化比较严重，不同Android版本的Webview的HTML5能力也有较大差异，导致相应的HTML5应用一致性难以保证。所幸已经出现一些第三方的Web引擎以提供比系统默认的Webview更好的功能和性能，而PhoneGap/Cordova也正在改进架构以便引入这些更好的第三方Web引擎。
总的来说，HTML5应用的能力很大程度上依赖于Web引擎的能力。因此，无论是移动操作系统开发商还是开发工具的开发商，都持续在Web引擎的方向投入了更多的努力。
Web引擎
Web引擎目前大致可分为三种方式：
- 浏览器，比如Safari/Chrome/UC Browser等;
- 系统自带的Webview组件，比如上面提到的iOS UIWebview和Android Webview
- 专门的Web Engine，比如Intel的开源项目Crosswalk、Ludei的Webview+
浏览器方式很容易理解，一个HTML5应用就是一个Web页面，用户通过浏览器打开一个URL，然后进入浏览器的全屏模式/App模式进行操作，或者是通过点击一个事先创建好的快捷方式打开应用。这种方式的性能取决于浏览器本身对HTML5的支持情况，一般来说要优于Webview组件的方式，但是问题在于不同的浏览器有差异，而且通过浏览器运行HTML5较难做到类似原生应用的体验（应用切换/权限管理/系统资源访问/整合等）以及丰富的API支持。
Webview组件方式的一般用法是以Hybrid的方式发布HTML5应用，即上述提到的PhoneGap/Cordova方案所采用的方式。其问题已经在上面提到过，主要是Webview组件本身对HTML5的支持能力不足。
专门的Web引擎可以有较好的HTML5功能和性能支持，同时有较好一致性，类似原生应用的系统整合也可以做得较好。这种方式的缺点则在于开发者需要将Web引擎与应用程序一起打包，生成的应用大小会更大，因此有的Web引擎（如Crosswalk）也提供了一种“共享模式”，让多个应用可以共享一个Web引擎，仅当应用第一次启动并且发现系统还没有相应Web引擎时才提示用户下载安装。
目前的发展趋势是：通过PhoneGap/Cordova方式得到丰富的API支持，通过专门开发的Web引擎去提升HTML5的能力。
