WinJs.Pivot = Navigation issue when more than 5 sections. Memory leak due to caching? Any ideas? RRS feed

  • Question

  • Hi there.

    Did anyone notice, when creating a pivot application for Windows Phone, if you add the content dynamically and you have more than 5 sections (section1Page, section2Page, etc), when you swipe left or right, after a few pages, you get a visual error:

    The page seems to go away to let you go to the next one, but, instead, it goes back to the one you were in.

    I have been making some research and it seems it is due to a memory leak... (I thought, at the beggining, it was because the cache had too much info)


    if that happenned to anyone and found a way to solve it, please let me know... and, also, if you get an idea on what I can do, please, post it here

    What I have tried, so far:

    Handling a swipe manually: It will recognize when you press on the screen, but it will not when you move, since the pivot control will move the page with you, so your finger will remain at the same coords, where you put it on the first time.

    Disabling caching: I tried to find out how to do it, but I was not able to find it anywhere.

    Create a whole new pivot application, loading the pages manually: The app, before, created the pivot sections programatically, taking the info from the server (API)... now it has 19 sections, and each one of them has its own header and the only thing they get from the server is their content (movies)

    To give you an idea, of the code involved, here there´s some:


    function initialize() {
        var request = new HttpRequest();
        request.service = "utils/serverTime";
        request.cache = false;
        request.callback = function (data) {
            if (isSuccessResponse(data)) {
            } else {


    function inicializarPaginas(options) {
        for (var i = 0; i < options.length ; i++) {


    //global var
    var _toDefinePages;
    function definePages(item) {
        _toDefinePages = item;

    Each Page section.js (section1Page.js, section2Page.js, etc)

    function initMovies() {
            var elemento = document.getElementById("movieContainer10");
            var movies = _toDefinePages[9];
            var element;
            element = loadMoviesListing(movies);

    And just to clarify, default leads you to boot, boot loads an extended splash screen function, then it goes to the hub to handle the whole application

    Any ideas or help would be fantastic!

    Wednesday, August 19, 2015 10:16 PM