PhoneGap is a cross-platform framework for developing mobile applications using HTML, CSS, and Javascript. The framework allows you to embed these assets locally within a native rich application in order to give the end user the impression they are using a native application rather than HTML being rendered in a mobile browser.

PhoneGap also allows web developers who don’t know Java or Objective-C (in the case of Android and iOS) an opportunity to create rich apps using their familiar technologies and an arguably quicker method for creating rich apps for most other developers. In the case of Android, it’s as simple as creating a new project, including the PhoneGap jar and tweaking a couple of values in one of your activities to get going with PhoneGap. For iOS, once you install the PhoneGap software, you can create new PhoneGap projects through XCode, which have most everything configured for you.

You can also extend PhoneGap’s out-of-the-box functionality by writing your own Plugins. The advantage of using Plugins is that, chances are, someone else has already done what you’re trying to accomplish, and with a little bit of searching you can re-use code someone else developed. Plugins are pretty easy to craft yourself if you can’t find what you’re looking for, and in version 1.0, PhoneGap unified the way iPhone and Android plugins are called from the Javascript, allowing you to consolidate separate Javascript code for each platform into one file, which was certainly a nice improvement. (I plan to write a TechRepublic tutorial on how to write PhoneGap plugins for Android.)

If you want all the UI of your application to be in HTML, then PhoneGap is a great option, especially when paired with a mobile web library, such as jQuery Mobile or Sencha Touch. But if you want to create a hybrid UI with native and HTML components, then things can get a bit hairy trying to make the two coexist. At least in the case of Android, you must inflate any XML layout views in code and then insert them in the root LinearLayout around the default WebView if you want to do something like create toolbars above and below the WebView. The timing of exactly when you do this is also important, as the WebView can get sized incorrectly otherwise.

All Plugins are run on a separate thread than the UI, so if you want to modify any Views from within a Plugin, you are out of luck unless you take an alternative approach. One trick I have found is to register Broadcast Receivers in your Activity. Then, you can broadcast intents from your Plugin and manipulate the Views from inside the broadcast receiver of your activity. It’s far from ideal, but it definitely works.

My take

As each mobile OS progresses, so does the level of quality and sophistication we come to expect from our applications. While HTML, CSS, and Javascript (in particular HTML5) can produce some amazing web applications, mobile browsers have not come far enough to justify sacrificing some of the performance and “look and feel” of a completely native application. While there are some incredibly jaw-dropping HTML5 web apps out there, I have yet to see one on a mobile device and be “wow’ed.” Furthermore, statistics have shown that iOS and Android users spend way more time in native rich apps than mobile web apps, and I believe this is because the quality level is simply unmatched at this time.

I think this will change in the very near future. If you look at the improvement in the Javascript engines alone in the iOS and Android browsers between major releases, it’s encouraging to see where things are headed. There have even been rumors of Chrome being ported to Android, and if/when that happens, I’ll start writing more HTML5 apps to try and push the browser to its limits.

For now, I still think there’s a lot of benefit in creating completely native rich apps. And seeing how the growth of mobile OSs such as Android has yet to stagnate, if you’re a developer who wants to create rich apps, then it’s definitely worth your time and effort to learn how to do it. The job market speaks loudly to this point, as native rich app developers are in hot demand right now and in hot tech markets like Austin, TX, you will have no trouble finding work as an Android or iOS developer. At the bare minimum, you should consider mixing native UI and HTML5, which as I stated earlier is not exactly straight-forward with PhoneGap and requires you to think outside the box a little.

In a future TechRepublic tutorial, I’ll show how PhoneGap achieves the Javascript-to-Java (and vice versa) communication and how you can write your own very simple lightweight version of PhoneGap.