1. Phonegap and Cordova
The relation between these two: http://phonegap.com/2012/03/19/phonegap-cordova-and-what%E2%80%99s-in-a-name/ ; Basically, the phonegap is a distribution of Cordova.
The project (JIRA) page of Cordova: https://issues.apache.org/jira/browse/CB#selectedTab=com.atlassian.jira.plugin.system.project
Phone gap gives you more service:
Comprehensive documentation: https://github.com/phonegap/phonegap/wiki
Phong gap build: https://build.phonegap.com/
Phone gap command line build and run: http://docs.phonegap.com/en/2.7.0/guide_command-line_index.md.html#Command-Line%20Usage
Test and debug phone gap apps: http://www.tricedesigns.com/2013/01/18/my-workflow-for-developing-phonegap-applications/; http://css.dzone.com/articles/phonegap-awesome-hybrid-app
IDE(The AppLaud Eclipse plug-in): http://code.google.com/a/eclipselabs.org/p/mobile-web-development-with-phonegap/
Using Weinre and log: https://github.com/phonegap/phonegap/wiki/Debugging-in-PhoneGap
Testing library: Qunit, Jasmine (http://wiki.apache.org/cordova/RunningTests)
Debugging web app on Android: http://developer.android.com/guide/webapps/debugging.html
Java script debugger: http://www.jshybugger.org/
How to use eclipse to debug by jshybugger : https://www.youtube.com/watch?v=P5NSlN8eVyk
PhoneGap plugin: https://github.com/phonegap/phonegap-plugins/tree/master/Android
One of Phonegap feature, hydration: https://build.phonegap.com/docs/hydration
There are many mobile web UI gadget framework works on Phone gap:
(i) jQuery Mobile http://jquerymobile.com/
(ii) Sencha Touch http://www.sencha.com/products/touch/
(iii) GwtMobile(Google Web Toolkit) https://github.com/dennisjzh/GwtMobile
Tips for building phonegap apps: http://stackoverflow.com/questions/5161004/using-phonegap-for-native-application-development
Pros and cons of Phonegap: http://stackoverflow.com/questions/11829551/when-is-it-better-not-to-use-phonegap
2.Titanium
Major change on 1.0:
The CSS and HTML are gone: http://developer.appcelerator.com/question/71/what-happened-to-html–css
the JavaScript Runtime environment of a Titanium Mobile application: http://developer.appcelerator.com/blog/2010/12/titanium-guides-project-js-environment.html
3. Comparison
Comparing Titanium and PhoneGap: http://developer.appcelerator.com/blog/2012/05/comparing-titanium-and-phonegap.html
A thread with detail discussion about both phonegap and titanium:
http://stackoverflow.com/questions/1482586/comparison-between-corona-phonegap-titanium
4. Self-Written
Creating Native UI using javascript and HTML: http://www.codefessions.com/2012/09/creating-native-user-experience-with.html
Pros and Cons and a primer for hybrid apps:
https://www.cocoacontrols.com/posts/a-primer-on-hybrid-apps-for-ios
Below is copied from second answer of this post:
PhoneGap/Mobile Web Performance Tips
- How Diary.com increased the performance of their PhoneGap app running Sencha:http://www.phonegap.com/2011/06/21/building-the-diary-com-ios-app-using-pg-sencha-touch/
- http://floatlearning.com/2011/03/developing-better-phonegap-apps/
- http://jslint.com/ – to debug your javascript
- http://zeptojs.com/ and http://xuijs.com/ – minimal alternative frameworks to jquery and jqtouch
- Disable the accelerometer and location http://blogs.nitobi.com/jesse/2009/10/28/running-jqtouch-in-phonegap/
- set “EnableAcceleration” to false in PhoneGap.plist
- set “AutoRotate” to false in PhoneGap.plist
- http://mir.aculo.us/2010/06/04/making-an-ipad-html5-app-making-it-really-fast/
- http://cubiq.org/remove-onclick-delay-on-webkit-for-iphone
- Demo: http://cubiq.org/dropbox/clickdelay.html
- FastClick v TouchStart:http://groups.google.com/group/phonegap/browse_thread/thread/f5f5c78e26513821?pli=1
- http://forum.jquery.com/topic/ontouch-instead-of-onclick-event
- http://wiki.phonegap.com/w/page/16494809/Performance-tips-for-device/
- http://www.developer.nokia.com/Community/Wiki/JavaScript_Performance_Best_Practices
- http://evolvingwe.com/building-an-iphone-app-part-3-7-dev-tips/
- http://evolvingwe.com/upgrading-to-phonegap1-0/
- VIDEO Performance Tips for Sencha Touch: http://vimeo.com/17882927
- It covers performance features in Sencha, which are great principles we can reapply. We may even be able to cut code from certain pieces of Sencha to reapply for Skej.
- It states that we MUST destroy anything that is not visible on the DOM. And that the DOM must be kept as small as possible at all times, with as few listeners as possible. (I.e attach one listener to the parent item of a list, rather than to each list item.)
- It also has practical CSS3 tips for me to apply… Basically, dont use many of the new transitions and shadows/round corners because the currently use CPU, and not yet GPU.
- Event Delegation in Sencha Touch: How to design lists with a single listener, and not one on every line. http://www.sencha.com/blog/event-delegation-in-sencha-touch/
- Optimizing DOM Memory Usage in Sencha Touch: Sliding from a List to a Details panel and killing the list, and then sliding from Details to a List and killing the details panel. Minimizing elements on your screen, your DOM. http://www.sencha.com/blog/sencha-touch-optimizing-memory-usage/
- DESTROY ANYTHING THAT IS NOT VISIBLE ON YOUR DOM!
- Use CSS Animations instead of jQuery
- http://nyroo.com/l/B7UN5c
- http://www.ferretarmy.com/css-animation-examples/
- Be careful… these are tricky when they don’t leverage the GPU, and bog down the CPU.
Enabling New Functions
- Enable Retina Display: http://evolvingwe.com/create-retina-display-images-in-mobile-web-themes-and-phonegap-apps/
- Swipe to delete: http://www.codesta.com/blog/2011/5/23/sencha-touchphonegap-tips-and-tricks.html
- Disable accelerometer and location: http://iamcam.wordpress.com/2009/10/29/phonegap-up-to-speed/
- Cut jQuery and Hand-code: http://cubiq.org/do-you-really-need-jquery-for-mobile-dev
- Display Contact List in Mobile Safari: http://cubiq.org/contact-list-on-webkit-for-iphone
- iScroll4: Create a header, scroll within a fixed size div, pinch and zoom, pull up/down refresh.http://cubiq.org/iscroll-4 (Includes tips on rubber-band effect.)
- PhoneGap’s GitHub repo: Includes interesting examples like DatePicker, SMSComposer, ApplicationPreferences, Splashscreen, NetworkActivityIndicator…https://github.com/phonegap/phonegap-plugins
Architecture
Architecting your App in Ext JS 4: http://www.sencha.com/learn/architecting-your-app-in-ext-js-4-part-2