Phonegap low performance issue

Question

I built an android app using PhoneGap and JqueryMobile framework containing several html and js pages.

the first loading time is very high ( 5-10 seconds later vs native apps) and page navigation is too slow.

Navigation from one screen to another taking lot of time.

Are there any hints/howtos/tricks to increase speed? It's really unusable for an often used app.

An other issue is too app's memory usage ( around 50mb for a simple application)

All tricks and hints are welcome.

devnull · Accepted Answer

A few optimization tips I have found to be helpful on slow devices:

Try changing the default page transition. Many Android devices do not support hardware accelerated features of the handset in the browser, which means that the CSS3 transitions that JQueryMobile tries to use by default are very slow. You can use:
```
$.mobile.defaultPageTransition = 'none';
```
to turn off all of the default transitions.
As far as script load time, there is not much you can do besides perhaps examining the individual load times for your dependencies and figuring out alternatives - but you can ensure that your app doesn't look wonky while it loads. Here's a quick hack I use:
```
<style type="text/css">
  .doc {display: none;} /* don't show body by default */
</style>

<body id="main_body" class="doc"> 
```
Once everything loads, I call
```
$("#main_body").removeClass("doc");
```
to show the application. I use a Javascript preloader (LABjs) in order to ensure all of my dependencies get loaded in order.

Donate For Us