Monday, June 3, 2013


Increase JQuery Mobile speed loading in Android using phoneGap or whatever




1) Put the JavaScript end of body befor </body>

2) Integrate the jquery function with phoneGap function for example in my code app is consuming JSON from a PHP server. I used

document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
        $.getJSON("http://aamirkhan9876.byethost7.com/mobMoviesServer/services/m/get_banners.php",function(jData){//code});
}
onDeviceReady(); is provided by phoneGap.

3) Use splash screen instead of black screen because PhoneGap application takes time on startup. A black screen appears for few seconds. To avoide that use a splash screen.

On DroidGap Activity. use
        super.setIntegerProperty("splashscreen", R.drawable.images);
        super.loadUrl("file:///android_asset/www/index.html", 10000);  
 It will show the splash screen instead of black screen for 10000 ms.
 For activity loads before this time use blow code in index.html
 function onDeviceReady() {
      cordova.exec(null, null, "SplashScreen", "hide", []);
}
4) Make JavaScript and CSS External

5) Put Stylesheets at the Top

6) Avoid jquery mobile nvigation transition. If you can.
     $.mobile.defaultPageTransition="none"
7) Compress/Minify your js & css files. Use any Compressor such as yui compressor .