Marvin Rabe

Advice for PhoneGap beginners

If you started with PhoneGap recently or plan to do it in the future, let me give you some advice. This blog post will protect you from losing too much nerve while working with PhoneGap.

I am working on projects that use PhoneGap for one year. I gathered some helpful tips for you.

##Don’t do Windows Phone##

On every device you have a different HTML rendering engine. Even the JavaScript engine varies. The Windows Phone is the only modern smart phone with a browser that is not based on WebKit. There you have the Internet Explorer based on Trident.

With your (probably) WebKit optimized app you will definitely run into a lot of problems. The best thing for you would be to only develop for Android and iOS.

##Damn, use the PhoneGap CLI##

With PhoneGap 3.x a new node.js based command line interface (CLI) was introduced to make the development process much simpler. You could avoid the CLI most of the time. Just create the platform builds for your app once and delete all the redundant junk afterwards. It would work like in the old days.

But, you really have to use it. PhoneGap’s release cycle is very tight. Updating your app to a new version of PhoneGap with the CLI makes it much easier. With this tool you can also build multiple platforms of your app simultaneously and do some other neat things.

Please spend some time learning how to work with it. It isn’t that hard to understand and you will thank me for it at some point. More about the CLI on the PhoneGap website.

##Optimize, optimze, optimize##

In my latest PhoneGap app I saved over 30MB of memory by compressing my JavaScript and CSS files. You should do it too. There is a good article which explains how to speed up jQuery mobile. Even if you don’t use jQuery mobile, this article is still valuable for you.

I also experienced some major improvements by getting rid of jQuery in one of my Chrome plugins. This idea is only for the hardcore people, but if you need every millisecond, then don’t use jQuery.

##Keep your app simple##

Mobile phones don’t have strong video cards. So there are problems with full screen UI updates, filters, shadows and transparency. The more you use it, the more laggy your app will be.

jQuery mobile is not intended for PhoneGap apps, but if you have to use it, don’t use another framework next to it. Keep the overhead as low as possible (there is a builder for jQuery mobile). And please take a look on the documentation before diving straight in. This framework is badly documented and most of the time you will looking for answers directly in the jQuery mobile source code.

Don’t use too much JavaScript. It will slow down your app. There is a great article about why mobile web apps are slow. I recommend that you read it. It will give you some insights on JavaScript engines on mobile devices.

##Don’t pretend to be native##

Like I said earlier, mobile phones don’t have strong video cards and JavaScript is much slower there. So don’t try to fake native animations, fancy native transitions or other complex native behaviour. It is totally fine to have an app without all the native bling-bling.

##Tl;dr##

To sum it up: