2009-04-03 8 views
5

Les performances JavaScript dans Internet Explorer sont nulles. Pas de nouvelles là-bas. Cependant, il y a quelques trucs et astuces pour l'accélérer. Par exemple, il y a threepartseries. Pourtant, je me trouve incapable d'en tirer une performance décente. Peut-être que certains d'entre vous ont une idée de ce qu'il faut faire d'autre pour que ce soit plus rapide?Problème de performances Javascript pour Internet Explorer

Ce que je veux faire est de créer une table de taille moyenne à partir de zéro en Javascript. Dites, 300 lignes, 10 cellules chacune. Cela prend environ 5-6 secondes sur mon ordinateur pour le faire. OK, accord, c'est une plate-forme de 5 ans, mais c'est encore trop. Voici mon code fictif:

<html> 
    <body> 
    <script type="text/javascript"> 
     function MakeTable(parent) 
     { 
     var i, j; 
     var table = document.createElement('table'); 
     var insertRow = table.insertRow; 
     for (i = 0; i < 300; i++) 
     { 
      var row = insertRow(-1); 
      for (j = 0; j < 10; j++) 
      { 
      var cell = row.insertCell(-1); 
      cell.innerHTML = i + ' - ' + j; 
      } 
     } 
     parent.appendChild(table); 
     } 
    </script> 
    <div onclick="MakeTable(this);">Click Me!</div> 
    </body> 
</html> 

Ajouté: Hmm, apparemment chaîne concaténation (avec Array.join) est la seule façon d'aller. Eh bien, triste, bien sûr. Espérait le faire le "bon" DOM-way. :)

Répondre

4

Voici un lien intéressant que j'ai trouvé lors de la recherche d'une réponse à ce sujet: La page utilise cinq scripts/méthodes différentes pour générer une table.
Selon leurs tests, l'utilisation de chaînes est beaucoup plus rapide que l'utilisation d'éléments DOM/Table. http://www.quirksmode.org/dom/innerhtml.htm l

-2

Vous pouvez essayer "le dispositif de Duff: déroulage une boucle en répétant le code plusieurs fois:

for (var i = 0; i < count/4; i++) { 
    doSomething(); 
    doSomething(); 
    doSomething(); 
    doSomething(); 
} 

Évidemment, cela laisse le reste lorsqu'il est divisé par 4, l'appareil du Duff original avait un intelligent manière de sauter au milieu de la boucle en utilisant une instruction switch mélangée à la boucle. Javascript ne supporte pas cela, mais vous pouvez traiter manuellement le reste de vos lignes. Aussi le nombre 4 est aléatoire, le nombre lui-même peut être dérivé par des tests de performance.

Voir aussi: http://www.websiteoptimization.com/speed/10/10-3.html

+0

WTF? Vous perdez les derniers éléments du tableau ... –

+0

C'est pourquoi j'ai dit "Evidemment cela laisse le reste quand il est divisé par 4". –

1

L'une des principales raisons des problèmes de performances d'Internet Explorer concerne les opérations DOM. Vous voulez faire vos opérations DOM aussi efficacement que possible. Cela peut inclure, en fonction de votre situation (repère!):

  • Création hors ligne de votre structure DOM; conserver l'élément de premier niveau hors du document (créer, mais pas ajouter) puis l'ajouter au document lorsqu'il est prêt, au lieu d'ajouter chaque élément au DOM lorsque vous le créez
  • écrire innerHTML au lieu de la manipulation DOM
+0

Le premier conseil est déjà là. Voir - la table est ajoutée au DOM à la toute fin. Je suis en train d'explorer innerHTML et il semble en effet être beaucoup plus rapide. –

+0

Oui, j'aurais dû le mentionner. Ce n'est pas toujours plus rapide, c'est pourquoi je voulais mentionner le 'Benchmark'! partie :-) –

Questions connexes