2009-04-03 15 views
5

Le prestazioni JavaScript in Internet Explorer fanno schifo. Nessuna novità lì. Tuttavia ci sono alcuni suggerimenti e trucchi per accelerarlo. Ad esempio, c'è questo threepartseries. Ancora mi ritrovo incapace di spremere prestazioni decenti fuori di esso. Forse alcuni di voi hanno un'idea di cos'altro fare in modo che fosse più veloce?Problemi relativi alle prestazioni Javascript di Internet Explorer

Quello che voglio fare è creare un tavolo di medie dimensioni da zero in Javascript. Di ', 300 righe, 10 celle ciascuna. Per farlo, ci vogliono circa 5-6 secondi sul mio computer. OK, scontato, è un rig di 5 anni, ma è ancora troppo. Ecco il mio codice fittizio:

<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> 

Aggiunto: Hmm, a quanto pare stringa di concatenazione (con Array.join) è l'unico modo per andare. Beh, triste, certo. Speravo di farlo con il "giusto" DOM-way. :)

risposta

4

Ecco un link interessante che ho trovato quando alla ricerca di una risposta su questo: la pagina utilizza cinque diversi script/metodi per generare un tavolo.
In base ai test, l'utilizzo delle stringhe è molto più rapido rispetto all'utilizzo di elementi DOM/Table. http://www.quirksmode.org/dom/innerhtml.htm l

-2

Si potrebbe provare 'Duff dispositivo': Unwinding un loop ripetendo il codice per un numero di volte:

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

Ovviamente questo lascia il resto quando diviso per 4, dispositivo originale di Duff aveva un intelligente modo di saltare al centro del ciclo usando un'istruzione switch mescolata con il ciclo. Javascript non supporta questo, ma potresti elaborare manualmente il resto delle tue righe. Anche il numero 4 è casuale, il numero stesso può essere ricavato dal test delle prestazioni.

Consulta anche: http://www.websiteoptimization.com/speed/10/10-3.html

+0

WTF? Stai perdendo gli ultimi elementi dell'array ... –

+0

Ecco perché ho detto "Ovviamente questo lascia il resto se diviso per 4" .. –

1

Uno dei motivi principali per i problemi di prestazioni di IE sono le operazioni DOM. Vuoi fare le tue operazioni DOM nel modo più efficiente possibile. Ciò può includere, a seconda della situazione (benchmark!):

  • Creazione offline della struttura DOM; mantieni l'elemento di primo livello fuori dal documento quando è pronto, invece di accodare ogni elemento nel DOM mentre lo crei
  • scrivi innerHTML invece di manipolazione DOM
+0

Il primo suggerimento è già lì. Vedi - la tabella viene aggiunta al DOM alla fine. Ora sto esplorando innerHTML e sembra davvero molto più veloce. –

+0

Sì, avrei dovuto dirlo. Tuttavia non è sempre più veloce, ecco perché volevo menzionare il "Benchmark!" parte :-) –

Problemi correlati