Top 10 Performance Techniques for PhoneGap Applications

by Christophe Coenraets on May 13, 2013 in PhoneGap

http://coenraets.org/blog/2013/05/top-10-performance-techniques-for-phonegap-applications/

1. TEST:  Test with the actual data and devices to feel the performance
2. Avoid reflow: Modify the DOM once. Put all data together, then update the DOM. Not frequently update the DOM. 
3. Do you really need the framework: Or you can just apply some CSS tricks to archive the same goal
4. Limit shadows and gradients:
5. Use CSS sprite sheets: Do not load each image individually
6. Avoid click event 300ms delay: Use touch event
7. Use hardware acceleration: Use CSS  transform: translate3d(-100%,0,0);  It will use GPU, instead of CPU.
8. Cache everything: cache static content, cache templates
9. Don't wait for the data to display the UI: display the UI, and update it when the data is ready. People do not wait on the UI, they are waiting for the data. 
10. Don't generate the UI on the server