2010-08-15 4 views
6

J'ai essayé plusieurs méthodes pour créer une application native d'une page à l'aide de Phonegap et je recherche des conseils généraux sur le dépannage.Avertissements de mémoire/Plantage avec l'application iPad PhoneGap

Première approche: Il est fondamentalement un tas de différentes pages et sous-pages chargées de jquery dans des conteneurs qui vivent sur la page d'index. Donc, pas de chargement de page, il suffit de charger des fragments de page à partir de pages dans un shell, en utilisant .load().

Deuxième approche: J'ai fait une page html d'une page avec tous les contenus, puis afficher et masquer que sur la base correspondant à la classe d'un élément de navigation à un identifiant d'un conteneur de contenu.

Les deux approches fonctionnent très bien mécaniquement. Le problème semble résider dans le fait que toutes mes sous-pages ont une galerie ou 2-6 images, (donc j'ai un total de plus de 215 images au total, 660 x 440) pour lequel j'ai utilisé le cycle jquery, et Touchwipe pour activer le défilement avec des gestes. Les galeries fonctionnent bien, mais après avoir fait défiler environ 35 galeries, l'application reçoit toujours un niveau d'avertissement de mémoire 1, puis 2, puis se bloque. Mon utilisation de la mémoire dans les instruments semble ok ... la version de fragment chargé ajax reste autour de 2 mégaoctets live octets, le one-pager reste toujours à environ 5 mégaoctets. Les galeries sont composées d'images de fond CSS dans les divs, car cela semble mieux fonctionner que les balises.

Je ne vois aucune fuite de mémoire, ou vraiment aucun autre problème en dehors des avertissements de la mémoire. Je suis un peu coincé sur la façon de suivre cela. J'ai fait des tâtonnements jusqu'à la mort. Ont réduit le javascript à l'essentiel. Quelque chose semble s'accumuler avec le temps.

Des idées sur la façon de comprendre ce qui se passe? Existe-t-il des premières approches pour s'assurer que rien ne se passe avec le javascript qui cause un certain type de fuite de mémoire?

Il est très frustrant que tout cela fonctionne plutôt bien, sauf sur l'iPad.

Ma prochaine tactique pourrait être d'essayer de réécrire les images d'arrière-plan de la galerie à un gif vide quand ils ne sont pas utilisés.

Voici le code que je utilise pour celui-récepteur portatif:

$(document).ready(function(){ 

    document.addEventListener('touchmove', function(e){ e.preventDefault(); }); 

    $('div#mainpages > div').hide(); 

    $("ul#mainnav li").click(function() { 
     $("#mainpages > div").hide(); 
     var navClass = $(this).attr('class'); 
     var target='#'+navClass; 
     $(target).show(); 
     $('[id^=subpages] > div').hide(); 
     $(target).find('[id^=subpages_] div:first').show(); 
    }); 


    $('[id^=subnav] li').click(function() { 

     $('[id^=subnav_] li').removeClass('current'); 
     $('[id^=subpages_] > div').hide(); 

     var subnavClass = $(this).attr('class'); 
     var subtargeted='#'+subnavClass; 
     $(subtargeted).show(); 

     $(this).addClass('current'); 

     $(subtargeted+' .gallery_div_shell').cycle({ 
      timeout: 0, 
      speed: 700, 
      speedIn: 300, 
      speedOut: 300, 
      fx: 'scrollHorz' 
     }); 

     $(subtargeted+' .gallery_div_shell').touchwipe({ 
      wipeLeft: function() { 
       $('.gallery_div_shell').cycle("next"); 
      }, 
      wipeRight: function() { 
       $('.gallery_div_shell').cycle("prev"); 
      } 
     }); 
    }); 
}); 

Merci pour tout conseil, je tire mes cheveux.

Répondre

1

À première vue, je ne vois rien de mal. Vous pouvez essayer de détruire explicitement la galerie de cycle jQuery lorsque vous ouvrez la suivante et voir si cela aide

$(youridentifier).cycle('destroy'); 
+0

Merci d'avoir jeté un coup d'oeil, j'ai essayé aussi. J'ai d'abord ajouté une classe à la galerie actuelle, quelque chose comme ".active_gallery", puis spécifiquement détruire cette galerie "cycle" spécifique en premier sur l'événement click de la navigation, puis retirer la classe avant de passer tout le code qui met en place nouvelle galerie du cycle actuel. Je n'ai pas encore eu de chance avec ça. Il semble que peu importe ce que, après avoir glissé à travers 35 galeries, il commence à avoir des avertissements de mémoire. Avec l'application de chargement ajax, j'obtiens le même résultat, même après avoir détruit les galeries du cycle, enlevé les gestionnaires de 'wipe', etc. – Transoptic

2

Je pense que le problème n'a pas été lié à javascript, mais lié à la quantité d'images WebKit peut maintenir en activité Mémoire. Il semble lié à cette question: Crashing when loading images

Ma solution était d'utiliser une combinaison de choses mentionnées ici. Tout d'abord, j'utilise des div avec une image de fond pour mes galeries. Deuxièmement, je commence avec toutes les images de fond définies pour être un GIF vierge. Quand je montre une sous-section et que j'active une galerie, j'utilise jquery pour réécrire l'image de fond css sur la source d'image réelle, puis quand je clique sur un nouveau sous-lien, je le réinitialise pour utiliser le GIF vide. Cela semble maintenir le nombre d'images d'arrière-plan div "actif" à seulement 3-7 à la fois, en dehors de l'interface gfx. Pendant ce temps, les quelque 200 autres divs avec des images d'arrière-plan dans les galeries (qui n'apparaissent pas de toute façon) ne sont qu'un gif vide.

Je pense que ce problème est lié en général à des limitations dans UIWebview, plutôt que quelque chose de spécifique à PhoneGap ou à jquery. Je ne suis pas certain que ce soit la solution finale, mais je suis capable de lancer l'application sans planter jusqu'à présent, et mes octets live dans l'instrument d'allocation restent constamment autour de 1,3 mégaoctet.