sign in sign up
<<
Home , Appcelerator Titanium, JQuery Mobile, Mobile app development

Application Development Platforms and Frameworks

Page . 1 Highlights

• Every major mobile OS comes with a rich app framework and powerful app development platforms – iOS, Android, Blackberry, WebOS, • Many 3rd party libraries, frameworks and platforms offer cross-platform alternatives to the OS vendor frameworks and platforms – PhoneGap, , Rhodes, Sencha… – The best enable applications built with web technologies …that have the look-and-feel of native applications …with full support for the native phone controls and touch gestures • Emerging HTML5 application platforms point the way to the future – Chrome OS, Alibaba Aliyum, Carbyn… – HTML5 enables web apps in the browser container to operate off-line • App cached on the device • Data stored locally on the device Development Tools

• There are a wide variety of tools available for creating mobile applications. These tools fall into three broad categories – libraries • Small, self-contained toolkits that offer specific functionality • E.g., UI widgets and 3D graphics – Application frameworks • A set of libraries, software components and architecture guidelines • Enable building a complete mobile application – Application development platforms • Everything needed to build a complete application and package it for distribution • Development tools are provided by OS vendors and by 3rd parties • OS vendors provide native OS platforms & development environments – 3rd parties provide libraries, frameworks and platforms Native OS Application Platforms & Development Environments

Every major mobile OS comes with a rich application development and execution environment, including: • Integrated Development Environment (IDE) – Industry standard langauges – – • Rich • Comprehensive set of libraries

Android iOS Blackberry WebOS Windows Phone

Primary languages Java Objective Java HTML, CSS, C# JavaScript Also supported C, C++ C, C++

IDE Eclipse Eclipse Visual Studio HTML5 – is the Future of

Apple has adopted HTML5, CSS and JavaScript – all open standards. Apple’s mobile devices all ship with high performance, low power implementations of these open standards. HTML5, the new web standard that has been adopted by Apple, Google and many others, lets web developers create advanced graphics, typography, animations and transitions without relying on third party browser plug-ins (like Flash). HTML5 is completely open and controlled by a standards committee … New open standards created in the mobile era, such as HTML5, will win on mobile devices (and PCs too). Steve Jobs, April 2010 Why HTML5

• HTML5 transforms the into a rich application platform – Rich user interfaces – Offline capabilities – Deep and secure hardware access capabilities • Availability – First public working draft of HTML5 published in 2008 by the W3C and WHATWG web standard consortia – Although the specification work is ongoing, browsers have already implemented many HTML5 features – Widespread use of the WebKit layout engine on iOS, Android, Blackberry, WebOS and has accelerated the mobile adoption of HTML5 The HTML5 Family

• So called “HTML5” apps are built using the suite of modern web development technologies – The Core HTML5 spec – CSS3 (Cascading Style Sheets Version 3) – Web Workers – Web Storage – Web Sockets – Geolocation – Microdata – SVG (Scalable Vector Graphics) – WebGL* – Device API and File API – And more specifications in progress

* WebGL is not a W3C specification. HTML5 Offline Capabilities

• Local application storage: AppCache – Enables offline access to applications – Fast – native app like – app load time – Caches entire web app locally • Application to be cached specified in Cache Manifest File • Data storage and access – Web SQL Database • Client-side SQLite database – IndexedDB • Object based data store – File / FileSystem APIs • Reading and manipulating • Creating and writing • Directories and System Building Mobile Apps with HTML5

• Pure web apps – Accessed using a standard browser – Fully encapsulated in the browser • Web apps transformed into native apps – Wrapped in a native wrapper (e.g., PhoneGap) – Compiled to native platform object (e.g., Appcelerator) – There are two broad reasons to do this: • Access to the native (e.g., iTunes) • Access to API's not exposed to the browser (e.g., accelerometer, camera) • Web pages invoked by a native app using the OS’s built-in browser 3rd party Libraries, Frameworks and Platforms

• There are a great many 3rd party libraries, frameworks and platforms • Most are cross-platform, some are OS specific (e.g., only for iOS) • Most support web development technologies – HTML, CSS, JavaScript… • Generally fall into one of three groups: 1. Compile a native app targeting one or more platforms • E.g., Titanium Appcelerator (/js/ -> iPhone/Android/Blackberry) 2. Wrap a web app in a native wrapper, exposing native APIs to the web app • E.g., PhoneGap 3. Enable touch-device optimized, native look and feel web apps • E.g., Sencha Libraries

Libraries are small, self-contained toolkits that offer specific functionality to the developer. Normally used in conjunction with other libraries and tools to make up the full mobile app. Examples include UI widgets and 3D graphics libraries. The best libraries for mobile application development enable the creation of touch-device optimized, native look-and-feel applications.

Library URL License Type A sample of the more popular 3rd party cross-platform libraries: Jo http://joapp.com Open Source Library JQTouch http://jqtouch.com Open Source Library JQuery Mobile http://jquerymobile.com Open Source Library http://www.sencha.com/products/touch/ OS/Commercial Library xui http://xuijs.com Open Source Library Frameworks

A framework is a set of libraries, software components and architecture guidelines that provides the developer with a comprehensive toolkit to build a complete mobile application, from top to bottom.

A sample of the more popular 3rd party cross-platform frameworks:

Framework URL License Type AML http://www.amlcode.com Open Source Framework Grapple http://www.grapplemobile.com/ Commercial Framework MotherApp http://www.motherapp.com/ Commercial Framework http://qt.nokia.com/products/qt-formobile-platforms/ Open Source Framework QuickConnectFamily http://www.quickconnectfamily.org/ Open Source Framework Sproutcore Touch Framework WebApp.net http://webapp-net.com/ Open Source Framework Platforms

A set of frameworks, tools and services that not only allow the user to build a complete mobile application but also to configure, package and distribute it to app stores or the cloud. Platforms normally include some sort of integrated development environment (IDE) to ease app construction, comprehensive documentation, support and automation tools.

A sample of the more popular 3rd party cross-platform platforms: Plaform URL License Type Adobe AIR Commercial Platform Appcelerator Titanium http://www.appcelerator.com/ Open Source Platform appMobi Platform MobileIron http://mobileiron.com/ Commercial Platform MoSync http://www.mosync.com/ Open Source Platform Phonegap (Apache Callback) http://www.phonegap.com Open Source Platform RhoMobile Rhodes http://rhomobile.com/products/rhodes/ Open Source Platform WidgetPad http://widgetpad.com Open Source Platform PhoneGap (Apache Callback)

• Technical architecture – Apps written in HTML, JavaScript and CSS – Run in a mobile browser embedded on a thin native app wrapper – Access to device’s capabilities through a device-independent JavaScript API which talks to the OS proprietary API’s • Supported platforms – iOS, Android, Blackberry, 6.5, , Palm • Strengths – Native wrapper source code is available for customization – Simple ‘drop-in libraries’ concept makes it easier to develop – Broad range of platforms supported – Apps built purely in HTML, JavaScript and CSS • Weaknesses – Lack of support for native UI components, design patterns and development tools • Best PhoneGap apps use Sencha Touch to provide native look-and-feel PhoneGap (Apache Callback)

• Free open source framework – Many contributors, including from IBM, RIM and • Originally created by Nitobi • Adobe acquired Nitobi in October 2011 – Provides Adobe with a pure web-technology mobile solution as an alternative to the proprietary Flash/AIR – Adobe committed to continuing to contribute to the code and to host the PhoneGap online community and the PhoneGap Build service – PhoneGap code was contributed to the Apache Software Foundation (ASF) under the name Apache Callback PhoneGap (Apache Callback) supported features

Source: http://phonegap.com/about/features/ Appcelerator Titanium

• Technical architecture – Apps written in JavaScript, compiled into native code – Creates target platform specific packaged • Enables distribution through app stores • Supported platforms – iOS, Android, BlackBerry (announced in 2010 but still in closed beta) • Strengths – Native code output so very quick and fluid on phone – Easy setup and start-up for developers – Excellent documentation and examples – Strong community forums to find out answers. • Weaknesses – Restrictive set of API’s – Currently only supports iOS and Android Appcelerator Titanium supported features

Capability iPhone Android

Geo-location Yes Yes

PIM Contacts Yes Partially

Camera Yes Yes

Native menu/Tab bar Yes Yes

Barcode No No

Audio/video capture Yes Yes

Bluetooth No No

Push/SMS Partially Partially

Calendar No Yes

Screen rotation Yes Yes

Native maps Yes Yes

Ringtones No No

Storage Yes Yes

Source: Tribal, Cross-platform mobile development, March 2011 RhoMobile Rhodes

• Technical architecture – Apps written in Ruby and HTML/JS/CSS, compiled to Ruby byte-code • Run in a Ruby on the device – Rhodes runtime • Contains the interpreter • Provides cross-platform common abstractions for accessing device capabilities • Supported platforms – iOS, Android, Blackberry, Windows Mobile 6.5, Symbian • Strengths – Business logic written in Ruby helps to create structured code – Model-View-Controller design patterns – Supports a broad range of mobile platforms • Weaknesses – Need to know Ruby well • Motorola Solutions acquired RhoMobile in October 2011 – What does this mean for future of Rhodes as a mobile app platform? RhoMobile Rhodes supported features

Capability iPhone Android BlackBerry Symbian

Geo-location Yes Yes Yes Yes

PIM contacts Yes Yes Yes Yes

Camera Yes Yes Yes Yes

Native menu/Tab bar Yes Yes Yes Yes

Barcode Yes Yes Yes Yes

Audio/video capture Yes Yes Yes Yes

Bluetooth Yes Yes Yes Yes

Push/SMS Yes Yes Yes Yes

Calendar Yes Yes Yes Yes

Screen rotation Yes Yes Yes Yes

Native maps Yes Yes Yes Yes

Ringtones Yes Yes Yes N/A

Storage Yes Yes Yes Yes

Source: Tribal, Cross-platform mobile development, March 2011 Sencha Touch

• A HTML5 mobile app library – Enables web apps that look and feel native on Apple iOS and Google Android touchscreen devices – Supports app development with HTML5, CSS3, and Javascript • HTML5 library of choice for building apps – Pure web apps that run in the browser – Hybrid apps created with PhoneGap, Appcelerator and Rhodes • Heavily documented, with a strong professional team providing support jQuery Mobile

• Touch-optimized version of the popular jQuery library for and tablets – Tools to build dynamic touch interfaces that adapt gracefully to a range of device form factors – Includes layouts (lists, detail panes, overlays) and a rich set of form controls and UI widgets (toggles, sliders, tabs) – Support for iOS, Android, Symbian, BlackBerry, Windows Mobile, WebOS, bada, , MeeGo • Built on the jQuery and jQuery UI foundation. • Supports progressive enhancement HTML5 Application Platforms and OS’es

• Application platforms that run web apps in HTML5 browsers – Google Chrome OS – Alibaba Aliyun OS – Carbyn (www.carbyn.com) – Boot 2 Gecko – Webian Chrome OS

• An open source, lightweight • Available on Chromebooks (i.e., netbooks) from Samsung and Acer – Built-in Wi-Fi and • Chrome OS consists of three major components – The Chromium-based browser and the window manager – System-level software and user-land services: the kernel, drivers, connection manager, and so on – Firmware • HTML5 applications available from Chrome Web Store Chrome OS Architecture Alibaba Aliyun OS

• Cloud-based OS for tablets and mobile phones • Developed by Alibaba’s Alicloud division • Develop apps with the latest web technologies – HTML5, CSS3, JavaScript • Cloud based services – e-mail, Internet search, weather updates, maps, navigation… – Synchronize and store user data in real time to AliCloud • Contacts, text messages, photos, call logs… • Free 100 GB storage data backup and synchronization. • Also supports Android apps • English version announced Example HTML5 Applications: Gmail, Google Calendar, and Google Docs

• Run in Google Chrome browsers – On PC’s, Macs, and Chrome OS devices • Apps cached in browser, sync user data to browser’s storage – Load instantly, available off-line • Installed from Google Chrome Web Store Example HTML5 Applications: Xero Mobile

• Business account web app • iOS app built with PhoneGap and Sencha Touch – Web app wrapped in native PhoneGap wrapper – Packaged as native iOS app • Installed from Apple App Store Example HTML5 Applications: Sugar Mobile

• Sugar CRM web app • iOS app built with Appcelerator – Web app compiled to native app – Packaged as native iOS app • Installed from Apple App Store Key Assertions

• The HTML5 family of web technologies is the future prefered mobile application platform • Google Chrome, Alibaba Aliyun and other HTML5 “OSes” provide proof points of the ability to provide a rich user experience with HTML5 • There are many HTML5 libraries, frameworks and platforms in the marketplace – Consolidation is underway – Many acquisition opportunities – Many open source opportunities BACKUP Mobile App Developer Platform Interest ‘Very interested’ in developing for each platform Mobile App Developer Platform Interest Trends

‘Very interested’ in developing for each platform Browser Support for the HTML5 Family

TABLETS MOBILE PHONES

HTML5 Bonus HTML5 Bonus OS Devices Score Points OS Devices Score Points iOS 5 Apple iPad 296 9 iOS 5 Apple iPhone and iPod 296 9 Touch

Android 3.2 Motorola Xoom, Samsung 215 3 Android 2.3 Google and 177 1 Galaxy Tab and others others

RIM Tablet OS 1 BlackBerry PlayBook 257 9 BlackBerry OS 7 BlackBerry Bold 9900 and 260 3 others webOS 3 HP TouchPad 195 5 webOS 2.1 Plus, Pre 2 155 5

Windows Phone 7.5 Samsung Omnia W, LG 140 1 (Mango) E906 and others

MeeGo/Harmattan Nokia N9 and N950 272 14

Opera Mobile 11.10 Multiple platforms 269 7 11.10 Multiple platforms 269 7

Firefox Mobile 6 Multiple platforms 254 9

Firefox Mobile 8 Multiple platforms 314 9 Firefox Mobile 8 Multiple platforms 314 9

The HTML5 test score is an indication of how well a browser supports the HTML5 standard and related specifications. The HTML5 test does not try to test all of the HTML5 features, nor does it try to test the functionality of each feature it does detect. The score is calculated by testing for the many new features of HTML5. Each feature is worth one or more points. Apart from the main HTML5 specification and other specifications created the W3C HTML Working Group, this test also awards points for supporting related drafts and specifications. Some of these specifications were initially part of HTML5, but are now further developed by other W3C working groups. WebGL is also part of this test despite not being developed by the W3C. The test awards bonus points for supporting audio and video codecs and supporting SVG or MathML embedding in a plain HTML document. These test do not count towards the total score because HTML5 does not specify any required audio or video codec. Also SVG and MathML are not required by HTML5, the specification only specifies rules for how such content should be embedded inside a plain HTML file. All results except for Firefox Mobile 8 are from html5test.com/results.html. Firefox Mobile 8 results are from MyMobilife tests using html5test.com.