Exception
Exception

Reputation: 8379

Cordova iOS app, page performance issues after coming back from background mode

I have written my iOS SPA using Cordova and it follows below mechanism

$$.ajax({
    type: 'GET',
    url: 'example.html',
    dataType: 'text',
    cache : true,
    async: true,
    success: function (response) {
         // Attach some handlers to elements.
         // There are bunch of closures here
    },
    error: function (xhr, type) {
         // Load previous page
    }
});

And in global I am adding delegated event handlers like below

$(document).on('tap', '.element', function(){
    // Do some actions
});

It works smooth when app is first time launched, but when app comes back from background mode to foreground, I can see below issues

  1. Scrolling is very slower, it behaves like if I do not give -webkit-overflow-scrolling : touch
  2. Switching between templates is very slow even though I do not have much data to display.
  3. On resume, I am getting contacts of the mobile, while getting them app goes into blocked and I could not tap any element.

What would be reason for these issues, I know there much me something causing an issue, but could not figure out. Please help me on this.

Upvotes: 3

Views: 677

Answers (1)

endemic
endemic

Reputation: 1366

Not sure if this would apply to you, but I had a similar problem with my Cordova app. It was a game that used requestAnimationFrame for updating. I found this thread on an HTML5 game dev message board, and it suggests to stop any update loops when the Cordova app goes to the background, then resume the update loop when the app is brought back to the foreground.

Their code example (of course, change based on your framework):

document.addEventListener("pause", function() {
    game.paused = true;
    game.raf.stop();
}, false);

document.addEventListener("resume", function() {
    game.paused = false;
    game.raf.start();
}, false);

The fix worked: no more slowdown. YMMV.

Upvotes: 2

Related Questions