原文地址:[http://blog.frontendforce.com/2010/05/mobile-application-development-using-javascript/](http://blog.frontendforce.com/2010/05/mobile-application-development-using-javascript/)
译者:蒋宇捷
Javascript并不仅仅只用于网页和网站程序。你还可以创建实时应用、服务端解决方案、桌面和移动应用。移动应用分为两种:浏览器里的网页应用和本地应用。本地应用通常更快更强大,因为它们有访问文件系统、传感器、照相机等设备的权限。本地应用通常使用手机指定的语言编写,例如Objective-C、Java。所以独立开发者通常使用HTML+CSS+Javascript的解决方案。幸运的是,感谢最新的技术,我们可以很方便的将网页应用转换为真正的本地应用。
**[Titanium Appcelerator](http://www.appcelerator.com/)**
**![](https://box.kancloud.cn/2016-08-02_57a05bd4f056d.gif)**
视频([http://vimeo.com/moogaloop.swf?clip_id=8730218&server=vimeo.com&show_title=0&show_byline=0&show_portrait=0&color=&fullscreen=1](http://vimeo.com/moogaloop.swf?clip_id=8730218&server=vimeo.com&show_title=0&show_byline=0&show_portrait=0&color=&fullscreen=1))
这个恐怖的工具允许你使用所知道的网页技术通过本地控制为iPhone、iPad、Android(稍后将支持黑莓)创建强大的移动应用。这些技术包括HTML5、CSS3、Javascript、PHP、Ruby和Python。此外,它最近还更新了文档。
你可以使用任何一个你想用的框架(例如Mootools、jQuery、Prototype)并利用上CSS3和Javascript的最新特性。这是因为Titanium程序实际上运行在聪明的嵌入式Webkit(即Safari)窗口中。从Titanium 1.0版本开始,除Webkit Webview外只有Javascript模拟器。像[米切尔所写的一样](http://css.dzone.com/articles/titanium-10-native-web-apps):
在Titanium 0.8版本中,Webkit的Webview被当作核心使用,周围是GPS、用户界面、相机和映射到操作系统的数据。而到了Titanium 1.0版本,开发者现在可以选择通过直接绑定到操作系统的API为iPhone上的Objective-C或者Android上的Java建立Javascipt桥。
如果你学习了[Titanium手机API](http://developer.appcelerator.com/apidoc/mobile/latest),你会发现它使用地理定位或者鼠标手势是多么的简单。你甚至还可以仅仅通过简单的几行代码,就可以把你的[应用连接到Facebook](https://developer.appcelerator.com/apidoc/mobile/1.3/Titanium.Facebook-module)。
**[PhoneGap](http://www.appcelerator.com/)**
![](https://box.kancloud.cn/2016-08-02_57a05bd51df99.gif)
就像Titanium一样,Phone Gap让你可以使用HTML和Javascript来为多个手机平台构建应用,包括iPhone、Google的Android、塞班、Palm和黑莓。你可以在[这里](http://wiki.phonegap.com/Roadmap)看看上面提到的这些平台目前支持哪些特性。
坦白的说,我只用过Titanium,但是PhoneGap看起来也是一个很好的选择。
另外还有[QuickConnectFamily](http://www.quickconnectfamily.org/)和[NibleKit](http://www.nimblekit.com/)。第一个相当强大,第二个缺乏文档同时不支持跨平台(只支持iPhone和iPod)。我还推荐[iWebkit](http://iwebkit.net/),但是它的主页最近被黑了(我没有开玩笑…)。
你可能会对让你工作更容易的框架感兴趣。例如,如果你希望你的应用有特别的iPhone界面和外观,可以试试:
**[jQTouch](http://www.jqtouch.com/)**
![](https://box.kancloud.cn/2016-08-02_57a05bd533eef.gif)
它可以使你轻松创建Webkit浏览器上运行的iPhone应用(还可以再使用Titanium 或PhoneGap 来创建本地应用)。
除jQTouch之外还有一个选择:IUI。你可以在[Google代码](http://code.google.com/p/iui/)里找到它。
如果你要选择一个轻量级和非jQuery的框架,可以试试[WebApp](http://webapp-net.com/),它被设计来模拟iPhone和iPod Touch真实的用户图形界面。
**[XUI](http://xuijs.com/)**
![](https://box.kancloud.cn/2016-08-02_57a05bd54c047.gif)
我们听到了你的话。另外一个Javascript框架是什么?!当使用PhoneGap开发时,使用现代的Javascript(例如Prototype、MooTools、YUI、Ext、甚至jQuery),会导致加载时间变慢。一个最大的原因是这些库太大,主要是它们包含了大量跨浏览器兼容性代码。到目前为止,手机平台上浏览器实现和不同的需求很少,所以请考虑XUI。
我已经说得够多了…
**[Cappuccino](http://cappuccino.org/)**
![](https://box.kancloud.cn/2016-08-02_57a05bd563b4c.gif)
这个框架为非Objective-C开发者设计,Capucchino引入了Objective-J。
Objective-J是一个基于Objective-C的新式编程语言。它同时是Javascript的一个超集,这代表着任何有效的Javascript代码也是可用的Objective-J代码。任何熟悉Javascript和面向对象原理的人,学习Objective-J不会有任何困难。熟悉Objective-C会有一些帮助,但不是必须的。
使用这个框架可以创建和桌面应用一样棒的手机应用(这要感谢Titanium)。可以看看一些示例:[280 slides](http://280slides.com/),[Mockingbird](http://gomockingbird.com/)或者[Github问题](http://githubissues.heroku.com/)。
**[iProcessing](http://luckybite.com/iprocessing/)**
**![](https://box.kancloud.cn/2016-08-02_57a05bd57e4e5.gif)**
使用上面的框架你可能无法创建3D应用和游戏。所以有了iProcessing。它是一个开放的编程框架,帮助人们使用Processing语言开发本地iPhone应用。它是Processing.js库和iPhone上Javascript应用框架的结合。
视频([http://www.youtube.com/v/tENliJSMEB8&rel=0&color1=0xb1b1b1&color2=0xd0d0d0&hl=en_US&feature=player_embedded&fs=1](http://www.youtube.com/v/tENliJSMEB8&rel=0&color1=0xb1b1b1&color2=0xd0d0d0&hl=en_US&feature=player_embedded&fs=1))
你还知道另外值得提到的框架?请给我回复。
- 前言
- AutoPager的简单实现
- 利用CSS3特性巧妙实现漂亮的DIV箭头
- IE9在Win7下任务栏新特性简介
- 浏览器九宫格的简单实现
- Raphael js库简介
- 使用CSS3构建Ajax加载动画
- 用CSS3创建动画价格表
- 用CSS3实现浏览器的缩放功能
- 用纯CSS3实现QQ LOGO
- 用CSS3创建旋转载入器
- 使用Javascript开发移动应用程序
- 用HTML5创建超酷图像灰度渐变效果
- 使用CSS3创建文字颜色渐变(CSS3 Text Gradient)
- 仅用CSS创建立体旋转幻灯片
- 如何创建跨浏览器的HTML5表单
- 用CSS3实现动画进度条
- HTML5 Guitar Tab Player
- 奇妙的HTML5 Canvas动画实例
- 谈HTML5和CSS3的国际化支持
- 实现跨浏览器的HTML5占位符
- 前端开发必备工具:WhatFont Bookmarklet-方便的查询网页上的字体
- 使用HTML5和CSS3来创建幻灯片
- HTML5之美
- 如何使用HTML5创建在线精美简历
- 以小见大、由浅入深-谈如何面试Javascript工程师
- 快速入门:HTML5强大的Details元素
- 用CSS3实现图像风格
- HTML5视频字幕与WebVTT
- 用纯CSS3实现Path华丽动画
- 用3个步骤实现响应式网页设计
- 遇见CSS3滤镜
- 关于CSS3滤镜的碎念
- 用纯CSS3绘制萌系漫画人物动态头像
- CSS3新的鼠标样式介绍
- 用HTML5献上爱的3D玫瑰
- 对HTML5 Device API相关规范的解惑
- 如何使用HTML5实现拍照上传应用
- 2012第一季度国外HTML5移动开发趋势
- HTML5新特性:范围样式
- 百度开发者大会-《用HTML5新特性开发移动App》PPT分享
- Chrome 19对于HTML5最新支持的动态:电池状态API,全屏API,震动API,语音API
- 遇见Javascript类型数组(Typed Array)
- 用HTML5 Audio API开发游戏音乐
- 用HTML5实现人脸识别
- 用Javascript实现人脸美容
- Chrome 20对于HTML5最新支持的动态:颜色输入,网络信息API,CSS着色器
- 用HTML5实现手机摇一摇的功能
- 用HTML5实现iPad应用无限平滑滚动
- 用非响应式设计构建跨端Web App
- 了解SVG
- HTML5图像适配介绍
- HTML5安全:内容安全策略(CSP)简介
- HTML5安全:CORS(跨域资源共享)简介
- 用CSS3 Region和3D变换实现书籍翻页效果
- 谈谈移动App的思维误区
- Chrome新特性:文件夹拖拽支持
- 《关注HTML5安全》
- HTML5安全风险详析之一:CORS攻击
- HTML5安全风险详析之二:Web Storage攻击
- HTML5图像适配最新进展:响应式图片规范草案
- HTML5移动Web App相关标准状态及路线图
- HTML5安全风险详析之三:WebSQL攻击
- Chrome引入WebRTC支持视频聊天App
- HTML5安全风险详析之四:Web Worker攻击
- HTML5安全风险详析之五:劫持攻击
- HTML5安全风险详析之六:API攻击
- HTML5安全攻防详析之七:新标签攻击
- 在iOS Safari中播放离线音频
- 使用WebRTC实现远程屏幕共享
- Firefox、Android、iOS遇见WebRTC
- HTML5光线传感器简介
- HTML5安全攻防详析之八:Web Socket攻击
- HTML5安全攻防详析之完结篇:HTML5对安全的改进
- 激动人心!在网页上通过语音输入文字 - HTML5 Web Speech API介绍
- Web滚动性能优化实战
- 用CSS3设计响应式导航菜单
- 用HTML5构建高性能视差网站
- 漫谈@supports与CSS3条件规则
- HTML5下载属性简介
- 如何开发优秀的HTML5游戏?-迪斯尼《寻找奥兹之路》游戏技术详解(一)
- 如何开发优秀的HTML5游戏?-迪斯尼《寻找奥兹之路》游戏技术详解(二)
- 趋势:Chrome为打包应用提供强大新特性
- 从HTML5移动应用现状谈发展趋势
- 基于HTML5的Web跨设备超声波通信方案