I’ve shied away from JS frameworks on the mobile platform primarily due to performance. I had not been able to find one that came close to native performance on Android. This changed last weekend when I tried out the Sencha Touch 2.0 dev preview. Performance is vastly improved over Touch 1.0. Animations and transitions are smooth, even on my Android 2.2 device and I was able to get up and running very fast.
Grab the Sencha Touch 2.0 Dev Preview here: http://www.sencha.com/blog/sencha-touch-2-developer-preview/
While I was able to get a basic app up and running quickly, unfortunately I spent a lot of time re-factoring into a proper MVC structure. The documentation on how to do this in Touch 2.0 is not there yet and there are some albeit small but killer differences between Touch1.0 and 2.0. To a novice like me they cost me a few hours.
Everything here was based off the Sencha ExtJS 4.0 walkthrough available here:
The sample code is available on Github and you can go here and download the entire project in a single ZIP/TAR: https://github.com/FrancisShanahan/SenchaTouch2MVCHelloworld
Or you can fork the repo using git: http://help.github.com/fork-a-repo/
Here are a few key points:
a) Let the app instantiate your controllers and any global stores your app needs. Notice how the initial layout is created using xtypes? These are created as aliases in the views.
b) Let your controllers instantiate your views and stores.
c) Use Component Queries instead of Ext.getCmp(‘id goes here’). This’ll keep your code more manageable as the code base grows. Note, the “ref” name here is important as it’s used to generate getters for the view instances. E.g. a ref of “stationList” will create a getter on the controller of “getStationList”.
I’ve already heard from a few folks so it looks like this project is helpful. It’s also ready for dropping into a Phonegap shell. Fork it and update or let me know if there’s anything you’d like to see added.
Attribution: Today’s photo comes from Anxo ResÃƒÂºa’s stream on Flickr http://www.flickr.com/photos/anxoresua/4652943076/