本文作者：IMWeb coolriver 原文出处：IMWeb社区 未经同意，禁止转载
前言
提到跨终端应用开发，很容易想到最近很火的React Native。使用React Native开发出的APP本质上是Native APP。在跨端应用开发这一领域内还有另一块：Hybrid APP。本文研究的inoic framework就是一种hybrid app的开发框架。
1. ionic基本组成
在之前，ouven的一篇文章介绍了ionic frameword的基本构成，和在windows系统上的环境搭建。本文在此基础了，对ionic frameword(后面简称 ionic)的基本组成作一些补充和总结。下图展示了ionic的基本组成：
在上图中，ionic所包含的范围为上图中蓝色部分。这四个部分都是现有的工具或技术，各个部分分别负责如下模块：
- Angular & Angular UI： 用于构建APP页面的框架，以及组件UI。
- Sass：用于编写和编译页面和组件样式。
- iconfont：用于iconfont图标。
- Cordova：用于将HTML， JS， CSS打包编译为不同终端的安卓包，并且为js与对应平台上的native api提供交互能力。
上面列了这么多，好像都是现有的技术和工具，那么ionic它本身到底做了什么呢？ionic的一个官方介绍文章里有句话概括了：
Think of Ionic as the front-end UI framework that handles all of the look and feel and UI interactions your app needs in order to be compelling. Kind of like "Bootstrap for Native,"undefined
ionic主要职责是作为app的前端UI框架，提供基本的样式以及各种UI组件，号称相当于native版的Bootstrap（虽然严格来说ionic构建的APP不是真正的Native APP）
2. ionic安装和使用
关于ionic的安装，在之前提到的ouven的一篇文章中有着较为详细的介绍，这里不再重复。对于ionic的使用，下面的图(图片源自The Ionic Framework Cheatsheet)有助于初次接触hybrid开发和调试的同学理清流程，并快速上手：
上图描述了在安装好了ionic的所有环境之后，如何通过ionic cli的各个命令从零开始构建一个demo app。
3. 基于Cordova的 Hybrid APP
- Cordova提供了一组设备相关的API，通过这组API，移动应用能够以JavaScript访问原生的设备功能，如摄像头、麦克风等。Cordova还提供了一组统一的JavaScript类库，以及为这些类库所用的设备相关的原生后台代码。（以上描述摘自百度百科）
- Cordova最早的名称是PhoneGap，后来被Adobe收购，Adobe将PhoneGap的核心代码抽出，贡献给Apache作为开源项目。Adobe在Cordova的基础上加上自己的特性和生态，继续沿用PhoneGap的名字。而原本的PhoneGap的核心代码以Cordova这个名字作为Apache的一个开源项目。目前Cordova与PhoneGap的关系类似于Webkit和Google Chrome的关系。
- Cordova支持多个终端平台，可以凭借这一点，实现一处编写前端代码，在各种平台上处处运行。目前Cordova支持的平台如下： iOS, Android,ubuntu phone os, Blackberry, Windows Phone, Palm WebOS, Bada 和 Symbian。
- 基于Cordova的Hybrid APP的基本原理如下图（图片是较早时候的PhoneGap，与Cordova原理相同）：
- Hybrid APP无法直接调用Native的API，而是通过WebView和Cordova的Plugins来调用。通过WebView能调用的系统功能只有WEB页面的一些基本功能，如页面展示和HTTP请求。如果要调用系统的其它一些Native功能，比如Camera,震动等等，则需要通过Cordova来实现。Cordova有一些核心的plugins来向js提供一些常用的Native能力，另外Cordova也可以通过自定义Plugins来扩展对Native功能的使用能力，所以理论上，只要有相应Plugins的支持，通过Cordova可以使用Native的所有功能。
- 虽然通过Cordova能够实现Web技术到APP的功能实现，但是这种基于WebView的Hybrid APP在性能上有着天生的缺陷。既然ionic是基于Cordova构建的，那么其性能也逃不出Hybrid APP的局限，使用ionic开发出来的APP必然和Native APP有着差距。那这种App是否有成功产品（或者说成功的产品）的能力呢？异或只是前端粉们的一个即兴而作的玩具？
4. ionic的适用范围
对于上文中的问题，ionic的官方博客中专门有一篇文章有说明。(点我是原文)原文较长，这里抽出最后关键的总结：
That said, Ionic is built for the devices of today and the future, not for devices built years ago. It’s focused on native app development and not mobile website creation.undefined
ionic声明了自己是做APP的而不是做website的（毕竟很多Cordova Native API无法在手机browser上使用），最重要的，ionic果断抛弃了屌丝机，拥抱高端机。
ouven的文章里已经总结了ionic的优缺。抛开目前hybrid app的性能问题，ionic确实为前端人员构建跨端应用提供了极大的便得，而且有活跃的社区用于分享技术和成果，有丰富的教程与指引。如果按照ionic对html5以及未来手机性能的乐观展望，目前的玩具说不定真能成为将来的产品。
