By now I’m pretty sure you know of PhoneGap. The framework that enables you to put an html5 app in a web view & push it into the different appstore. But do you know about PhoneGap Build?
Intended for the ones that do not want to get their hand directly into the sdk, this new product basically enables you to zip your app, upload it, receive a native android, ios & windows app. Nothing to install, nada, no xcode or android sdk to setup. Just a simple zip upload.
Did I told you it’s free for one app?
The test
Seeing the video I was excited annnnnnddd perplex. I had a beta build of the CakeMail mobile app (a backbone app basically) & so I decided to give it a try. I zipped my files, uploaded it & poof, magic. 2 minutes later I had a native build of my app. Installed it up on my android & it worked, well for the most part. I was really baffled, between that & trying to get phonegap setup correctly that was really easy.
Then I noticed my keyboard was on top on my content, not good. This get us to my next point.
The phonegap & phonegap build documentation..
Options for phonegap build are written in a config.xml. Unfortunately their getting started example is kind of old, which caused me a couple of issues.
When you first open the xml there is a lot of stuff that does not speak anything to you that are really important. One being
<preference name="android-minSdkVersion" value="7" />
Good luck finding a direct reference on the doc to what value minSdkVersion equals versus the android version because you need to google for uses-sdk to get a table reference. Turns out 7 is a really old version so I had to crank it up to 15 to support android 4.0.3 & up. Had to google it & found some comments saying that 15 was that version. Bad phonegap, bad!
Then there is the phonegap-version, in the example provided it was 2.9.0. Version 3.1.0 is already out & that caused me issues with my keyboard option which in turn would not work (but without causing any debug reference what so ever). Once I turned this to 3.1.0 then I was able to use windowSoftInputMode which help you control the keyboard view.
Like I said, since I did not know that windowSoftInputMode was not in older phonegap version using build I lost about 4 hours scourging the web reading people giving all kinds of tricks to get this to work, & that’s not generally a good sign.
Take another example, the basic phonegap install guide:
To Install 3.1: Ensure that you have NodeJS installed, then open your command line and run the following:
$ sudo npm install -g phonegap
Once installation completes, you can invoke phonegap on command line for further help.
Usage
$ phonegap create my-app
$ cd my-app
$ phonegap run androidProblem is, nothing is going to work when your going to do phonegap run android unless you, prior to that, installed a shit load of stuff. While there has been a big effort to simplify the phonegap process I still think there is a lot of work there.
Old doc when googling..
Another issue I had is when you google something like inappbrowser options the first link direct you to a very old version!!! Unfortunately that version did not had the same options has 3.1 so this was very frustrating.
The performance
Not a Phonegap issue per say. But you should know that the webview used by phonegap is generally one generation older than the current mobile browser provided with the device. That means that you wont get the same performance in a native app than on the web. I’m a bit sad that a brand new quadcore motoX can’t even handle perfectly my page animations. On ios the situation is better, an iphone 4 performs better than my brand new android phone.
Frankly there is a couple of ways to do animations. Sencha has probably one of the best system & their performance is really good but they use a ton of complex tricks to make that work, if you need a team of full time developers to make css or javascript animations work well on mobile that’s not really comforting for your average joe trying to make that work by himself.
I mean at this point (6 years since the first iPhone), we need to be on par with native on animations performance. If we get that nobody will be able to tell the difference between a web or native app. That will comes down to your UI & UX skills.
jQuery Mobile
At one point Adobe demonstrated their dreamweaver/phonegap/jquery mobile integration allowing you to ship apps directly in the appstores. But there is reports that Apple will not let you through since jQuery mobile animations perform too poorly, oups..
That is certainly one big reason to turn your back on mobile web native apps. If you are rejected because you use jQuery mobile what’s your next step? Code all your UI layer from scratch? Pretty sure your company execs will be happy about that.
The cool stuff
All that being said there is a lot of stuff that Build does amazingly. First you get an “hydration” mode, each time you push a new release the app on your phone is updated! You can also give a version to key people in your company so they can test your latest version.
Then you have the debug mode, you get a web version of your browser developer tools on the Build website, directly connected on your device so you can debug in real time what’s happening. No adb to install & usb cable!
You can also upload your new release directly from grunt! There is a npm package that connects directly to the phonegap build api. Personally I only do grunt buildnative & boom, ready to test on my android.
The community
Phonegap build is still free for one app, yet adobe developers are really quick to help you & respond to issues on the community website. Their support is really amazing & their is a lot of knowledge build there too.
Conclusion, it’s amazing
All that being said, Phonegap Build is really an impressive technology. I really hope that’s the future of mobile web apps development, because if it is, the future is really bright.
