Developing Portable Mobile Web Applications

What if you could write iPhone and iPad applications on Linux? And, what if those applications also ran on Android phones? Well, you can, by writing your application as a portable mobile Web application. Take advantage of HTML5 and JavaScript libraries to write rich Web applications that users can't tell from native applications. You even can have them install from iTunes and Android Market. Plus,

Mobile applications for iPhone and Android smartphones are where the excitement is today in application development. There are plenty of customers (Canalys says there were almost 8 million Android phones and more than 25 million iPhones sold in 2009), and those users regularly load applications on their phones (AdMob says Android and iPhone users average around nine downloads a month, and iTouch users average around 12). The demand for mobile applications is hot.

How can a Linux developer tackle this market? Native applications for the iPhone must be developed with the Apple iPhone SDK, which runs only on Mac OS X. Android development is supported on Linux with the Android SDK, but ideally, you'd like to develop apps on Linux that run on both iPhone and Android.

Mobile Web applications provide a solution. Web applications use the browser as a common runtime environment across different platforms. Applications are written in HTML, JavaScript and CSS, and run on the platform's native browser. This idea is not new, but historically, there have been a few issues with Web applications:

  • Browser security prevented the storage of local data.

  • Platform features like geolocation were not accessible from HTML/JavaScript.

  • Users had to start the browser to use a Web app, which then didn't match the native UI.

  • Browsers themselves were fragmented—different browsers interpreted JavaScript in different ways.

These problems are being addressed, and fortunately, Android and iPhone both selected WebKit as the layout engine for their respective browsers. HTML5 extends what a Web application can do, and creative people have devised JavaScript libraries that minimize the look-and-feel issues. The solution is an ongoing process, and it isn't complete.

HTML5 and related specifications add features like canvas, video, local storage, Web workers, off-line applications and geolocation to HTML, and WebKit is rapidly integrating these into the layout engine.

Specialized runtimes and libraries exist to allow JavaScript access to underlying phone functions, such as location, acceleration, sound, contacts, battery, camera, telephony and calendar. Some of these (for example JIL, BONDI and WAC) are industry-led, involve custom Web runtimes and aim to provide a universal widget environment across platforms. Others (such as PhoneGap, Titanium and Rhomobile) focus on iPhone and Android, with ties to the native SDKs that extend the capabilities of Web apps. As HTML5 implements similar features, these libraries generally conform their APIs to the HTML5 APIs.

JavaScript libraries have been developed to address the look-and-feel problem, including:

  • iUi: a small extensible library that mimics the iPhone user interface.

  • iWebKit: another framework for iPhone-style applications.

  • jQTouch: a plugin for the popular jQuery JavaScript library, which provides an iPhone style and a more general jQTouch style. jQTouch has the advantage of using jQuery to hide browser differences.

Android and iPhone both use WebKit as their layout engine, but there are still differences, partly due to the selection of different WebKit releases:

  • Android 1.6 (HTC G1) uses WebKit 525.20 and implements only Canvas, Canvas Text and Geolocation.

  • Android 2.1 (Motorola Droid) uses WebKit 530.17 and adds the rest of HTML5 (video, audio, local storage, Web Workers and off-line applications).

  • iPhone 3GS and iTouch use WebKit 528.16 and .18 and include all features except for Web Workers (multithreading).

  • iPad uses WebKit 531.21 and includes all features.

So What's the Catch?

Developing Web applications for smartphones is pretty straightforward, but there are some things you need to know:

  • It's not like C: if you're used to developing Linux applications in C or C++ or Java or Perl, this is different. Web application development is a little closer to the Android development environment, where screen layouts are in XML files, and functionality is written in Java, but mostly, it's like Web development.

  • Native apps require native SDKs: if you want users to be able to load your application from iTunes and Android Market, you have to enable that with the appropriate SDKs. There are workarounds that I talk about later.


Rick Rogers has been a professional embedded developer for more than 30 years. Now specializing in mobile application software, when Rick isn't writing software for a living, he's writing books and magazine articles like this one.


Comment viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.

Android compatibility.

tuna's picture

I'm getting my feet wet with mobile development and am trying to get this working. I'm developing on an HTC Droid Eris with Android 2.1. All I'm getting is a black screen. Any one have any ideas if it should work? Or where I should be looking?

"well documented elsewhere"

Anonymous's picture

"Installation of the tools is well documented elsewhere. The Resources section for this article gives pointers to the download URLs."

The resources indeed gives the pointers to the download URLs.
Is there also a link available for "well documented elsewhere"?
Is there also a pointer to the installation of the tools?

M. Moon