Monday, February 28, 2011

Tuesday, February 22, 2011

Phonegap and jQuery Mobile First Impressions

This past long weekend I decided to spend some time getting familiar with PhoneGap and jQuery Mobile.  After a couple of afternoons spent in coffee shops, walking through the learning curve and experimenting, I had a working app installed on my iPhone.  Not the most polished piece of boilerplate, but enough to show off to some friends, who were duly impressed.

These are my first impressions after muddling around with it for a while.

Why PhoneGap?

PhoneGap is one of several platforms that aim to make developing cross-platform mobile apps possible, and easy. It does this by wrapping a mobile web app in a stand-alone application that provides wrappers for the phone's native APIs, including accelerometer, sound, vibration, media, geolocation, camera and local storage. PhoneGap targets a large number of mobile platforms including Android, iPhone, Blackberry, Palm, Symbian and WebOS. It uses straightforward markup, script and stylesheets to build the application. Some of the native look and feel is sacrificed for the benefit of an application that runs the same on all these different devices.
 
PhoneGap doesn't provide a JS framework

Although PhoneGap gives you a convenient way to bundle a web app as a native app, and hooks into the devices native APIs, you are totally on your own with respect to what web-app framework you use, if any.  I started out writing raw HTML, CSS and JavaScript and soon realized that I wanted a framework.  I tried out both jqtouch and jQuery Mobile with mixed results.

Start with your web app

I could have saved a lot of time if I had started out just writing my app as a straight web app, and then transitioned it into PhoneGap after the main boilerplate was done.  Bearing in mind that PhoneGap is akin to a browser reading files off local disk, its necessary to structure the code accordingly. For example, jQuery Mobile converts hyperlinks to AJAX requests with callbacks that are handled by with animated page transitions. This works great if the link is another page served over HTTP, but it didn't work for reading files off the local disk.  As a result, all the markup for my app resides in a single file.  This is just a constraint of using jQuery Mobile on PhoneGap, at least for the time being.

jQuery Mobile Impression

jQuery Mobile is currently an alpha release, so its not fair to be too critical of it yet. But it is fair to say that it's not production-ready.  It tries to be clever with its navigation and often ends up getting lost. Errors are not handled graciously. Some advertised features, like fixed toolbars, simply don't work reliably enough to use.  That being said, if you take a look at the excellent jQuery Mobile demo page, and see everything you need to build your app and can stay within those limits, it should work well.

jqtouch impression

jqtouch has a bit less in the way of features compared to jQuery Mobile, but it seems more polished. The look and feel (both the default "dark" theme and the alternate "apple" theme) show a great level of attention to detail.  Seeing as it comes from Sencha Labs, this is not too surprising.

Sencha Touch
Sencha Touch is both polished and feature-rich.  Based on my experience with jQuery Mobile and jqtouch, Sencha will probably be my choice next time.  Check out some of the demo apps at sencha.com and you get an idea of just how far the mobile web-stack has come.

Don't fight the framework

With both jqtouch and jQuery Mobile, I tried to go beyond what you can see in the demo page, and quickly found myself fighting with the framework more than it was actually helping me.  I started to make progress when I gave up on my fixed idea of how I wanted things to work and let the framework dictate my design.  For example, I had to use a navigation bar at the top of the page, because a fixed navigation bar at the bottom of the page was too buggy. This is a problem that Sencha Touch seems to have fixed, and one of the reasons I'd probably choose it next time.

PhoneGap Simulator

For testing while developing,  I just opened my app in Safari. It can render all the page transformations and gives you a pretty close approximation of what you'll see on the iPhone.  There is also a PhoneGap Simulator, an Adobe AIR application that runs on Windows, Mac and 32-bit Linux.  I had problems with an early version downloaded from the author's blog, but there's an updated version known as the Sony Ericsson PhoneGap Simulator (v.1.3.0), downloadable from Softpedia.com.  It comes with skins for several different smartphones and goes beyond other simulators by providing a 3D model that you can manipulate to test the accelerometer, although it doesn't allow you to test all the native features wrapped by PhoneGap like the camera and local media.

Other Options

Appcelerator is a recent addition to the cross-platform mobile framework field, and although it only supports iPhone and Android at this time, it looks promising.  The unique advantage it offers is that provides access to the native user interface, so your application can be written in JavaScript and still run native widgets on the device, together with content rendered by the Webkit engine.  At first glance it seems extremely well put together and comes highly recommended from some pretty happenin' web dev folks.

Thursday, February 10, 2011

Human Tech

Software engineering should not be about getting humans to become more technical. It should be about getting technology to become more human.

http://www.spokeo.com/blog/2010/09/technology-becomes-more-human/

Tuesday, February 8, 2011

jQuery on the Command Line

This is too cool... A Jquery command line interface. TJ Holowaychuk posted it to his git repo last night.

https://github.com/visionmedia/query

Example:

   $ curl http://twitter.com | query logging img attr alt
   Twitter

Tell CRTC to Reverse UBB

The CRTC is soliciting input from Canadians on anti-competitive Usage Based Billing practices by Bell, Rogers, and other incumbent ISPs.  The Open Media group has a convenient online form letter that you can submit to the CRTC.

http://openmedia.ca/crtc

Go the Open Media page and let your voice be heard by the CRTC!

When I wrote that "dumb is the new smart" in December, predicting that consumers would demand dumb pipes, it was before the FCC ruling on the merger of Comcast & NBC and the CRTC 2011-44 decision.

That CRTC ruling and subsequent public uproar has brought the issue to a head faster than I imagined.  Alas it seems that big ISPs like Bell and Rogers don't get it yet, but a lot of Canadians seem to think that dumb pipes are a smart choice. Yay! They're demanding it loudly, even if the big incumbent ISPs were too slow to see it coming.

Sunday, February 6, 2011

Sunflowers

Sunflowers on an October afternoon.
©2010 Darren DeRidder

Steam Train

Working steam engine at Wakefield, Quebec.
©2010 Darren DeRidder

Tuesday, February 1, 2011

Petition Anti-competitive Internet Fees in Canada

Canadian ISPs want to charge you so much for Internet usage that it would be cheaper and faster to buy the most expensive solid-state hard drives and ship them across the country than it would be to download the same data online.  Sign the petition against Usage Based Billing.

Translate