Using PhoneGap for Hybrid App Development

Alicia Carter

Most businesses today want mobile apps for iOS and Android. They don’t care too much about the other popular mobile platforms because these two giants let them reach nine out of ten users.

However, when you are building an enterprise mobile app for a company that has implemented BYOD and needs to support BlackBerry and Windows mobile devices too, you are forced to develop four separate apps. Or, when an app achieves universal popularity, most app owners want to make sure that they dominate the same category on all mobile platforms.

Having flirted with website and web app development before hitching my cart to the mobile app development bandwagon, I felt that I should give a shot to cross-platform mobile development. When I started out, my web development skills were a little rusty while I was pretty good at iOS app development and average at Android app development. I chose PhoneGap because it supports a large number of development platforms: iOS, Android, BlackBerry, Windows, Symbian, and even Tizen.

Another reason for choosing PhoneGap was that it is a native WebView component with HTML5-CSS3 application and it has a structured API that uses JavaScript to access native functionalities of mobile devices. This means that an app you build on PhoneGap can access native functions from the devices as well as the mobile operating system. Theoretically, you can build high-performance apps on PhoneGap and make them work on several mobile platforms.

Beginning PhoneGap Development 

As with most other cross-platform mobile development apps, PhoneGap apps use HTML5 and CSS3 for rendering, while JavaScript is used for logic. This means that I had to wake up the dormant web developer within me.

Once I was up to speed on HTML5, JS and CSS3, I had to learn how PhoneGap worked. I spent a lot of time reading and skimming through the documentation, app building and GitHub pages for PhoneGap.

Most web developers don’t realize that you need to put in a lot of effort to understand how PhoneGap works. But you won’t lack for resources and sound advice from the community while you’re at it. While developing my first app (for iOS, Android and Windows), I ran into many problems. Some of them arose from my rusty skills, but I felt few had a lot to do with the nature of cross-platform development.

These are the most common problems that an app built on PhoneGap can run into:

  1. Mobile apps with numerous graphic elements or animations may slow things down on some mobile devices and make the app browsing experience a little choppy. Even with general apps there is a noticeable lag as most mobile phones are not fast enough to run hybrid apps. Android, especially, with its numerous versions of OS and devices, is a bigger nightmare than usual.
  2. The app cannot take the benefit of ALL the features of a phone. And trying to use device features requires a lot of hard work. Also, if you want to build an app for the latest version of any operating system, you need to wait for the PhoneGap update. It is bound to stay one step behind native platforms.
  3. The code you write runs everywhere – but you also need to do some coding and tweaking specific to different mobile platforms. This is pretty time consuming. Also, for newbies, fixing (and even identifying) errors can be a huge headache.
  4. I did not enjoy building and deploying on PhoneGap as I have to wait for PhoneGap to finish building. It can take from 2 to 20 minutes – if you’re impatient, this is a problem. Otherwise, it is not much of an issue.

While these are pretty common problems, there are solutions to most of them. And if you become an expert at PhoneGap development, there are many obvious advantages:

  1. You write one code, tweak it a little for all operating systems, and you have apps for 2-6 mobile platforms.
  2. If you have a background in web development and are good with JavaScript, PhoneGap’s learning curve is not too steep.
  3. PhoneGap is better than most other platforms that offer multi-platform development capability as it enables expert developers to support native features and functionality in the app.
  4. There is no dearth of tools – there are several places where you can find quick solutions to your problems and there are several JavaScript libraries that will make your work easier.

Should a native app developer try hybrid app development with PhoneGap?

I, personally, did not have a very good experience with PhoneGap (although I have an app with PhoneGap that works okay on three mobile platforms) as my web development skills needed some work. So, it took too much time to develop, debug, submit and re-submit the app for approval. But as the demand for apps that run across mobile platforms increases, it is important to build expertise in development with a multi-platform app development technology.

Do you know your way around HTML5, JavaScript and CSS3? If yes, PhoneGap presents a great opportunity for using those skills to create mobile apps.

If you are already into native app development, you know Java or Objective-C; those skills will also be needed.

You first foray in PhoneGap app development is bound to be a little deflating (as it is difficult to get good results without delving deep in the technology), but it can help you cut down the time and effort for development once you get better at it.

However, if you are not that much into HTML5 and JavaScript, there is no point in trying your hands at hybrid app development – native app development is going to be around for a long while yet.

Free book: Jump Start HTML5 Basics

Grab a free copy of one our latest ebooks! Packed with hints and tips on HTML5's most powerful new features.

  • J Garza

    Looking forward to learn PhoneGap, still I prefer native.

  • Jeff T

    Embarcadero has a product called HTML5 Builder. It is specifically targeted for building web and mobile apps, and is basically a visual front-end to PhoneGap builds to ease the design and development process. It is a drag and drop visual development environment with lots of properties to set and of course javascript to build or call.

    Has anyone had experience/thoughts using/about this development environment?

  • Stuart Gardner-Vauhan

    Thanks for such a concise and candid review – most appreciate.

  • Bernardo Kuri

    Thanks for the review. Unfortunately, it’s not clear PhoneGap version you’re reviewing, since v3.0 came out very recently, which is said to fix a few of the issues you described. I would also like to know which IDE you used, since that can obviously make quite a big difference as well. Finally, it would have been great to know a few examples of platform-specific tweaks that you had to perform in order to get your app to run consistently. Thanks again!

  • http://www.cygnismedia.com/web-application/ Cygnis Media

    Since new platforms and devices will keep being created, it makes sense that companies can save money by creating a hybrid app, that can be used as a full website on a desktop browser as well as provide enhanced mobile functionality, but I’m wondering what types of sites/services would rather build a hybrid app instead of a native one? Any examples?

  • Shivanand Arur

    Very nice post. Thank you for sharing your experience.