Ottimizzazioni Javascript per Internet Explorer

Question

È risaputo che i motori JavaScript di Internet Explorer sono molto indietro in termini di prestazioni, in particolare IE 8 e versioni precedenti, rispetto a Chrome, Safari (Webkit) o ​​Firefox (Mozilla).

Durante lo sviluppo di un'applicazione Web con funzionalità javascript significative, IE presenta prestazioni molto peggiori rispetto alle altre.

Esistono pratiche che potrebbero aiutare a migliorare il codice javascript in modo che la differenza tra i buoni risultati (non IE) e quelli con prestazioni scadenti (IE) non sia così ampia?

Answer 1

Penso soluzione ragionevole perché è Google Chrome Frame
Questo solo consentire l'uso Chrome Frame in IE e non usano in browser-IE non.

strumenti di performance e di sviluppo JavaScript per IE:
Microsoft Support: Internet Explorer Performance Article - http://support.microsoft.com/kb/982891

Answer 2

Un modo comune per ottimizzare le prestazioni è cache il valore di 'Max' in cicli for.

Quindi, supponiamo di dover iterare attraverso un array chiamato sampleArray. Si potrebbe ottimizzare la seguente dichiarazione:

var sampleArray = [3, 10, 12, 5, 9]; 

for(var i = 0; i < sampleArray.length; i++){ 
    var currentElement = sampleArray[i]; 
    // so something wit element 
} 

cambiando che sia:

for(var i = 0, max = sampleArray.length; i < max; i++){ 
     var currentElement = sampleArray[i]; 
     // so something wit element 
} 

Questo ha dimostrato di mostrare una abbastanza grande aumento delle prestazioni in tutti i browser. In particolare, IE7 ha dimostrato di avere una 190 volte aumento delle prestazioni utilizzando questo modello (da High Performance Javascript)

Answer 3

Un altro paio di soluzioni comuni:

Cache spesso utilizzato nodi DOM, non li ricalcolare nella stessa funzione di nuovo. Per esempio. invece di

$(id).parentNode.something(); 
$(id).parentNode.somethingOther(); 

uso

var e = $(id).parentNode; 
e.something(); 
e.somethingOther(); 

cache oggetti dal perimetro esterno utilizzato frequentemente. Per esempio. invece di

if (this.options.type == 'a') { 
    // ... 
} else if (this.options.type == 'b') { 
    // ... 
} 

uso

var type = this.options.type; 
if (type == 'a') { 
    // ... 
} else if (type == 'b') { 
    // ... 
} 

Questo avrà un impatto positivo anche sulla dimensione del codice prima e dopo minifying.

Answer 4

a. Un modo per aumentare le prestazioni nelle versioni precedenti di IE sarebbe utilizzare JavaScript RAW per creare elementi DOM invece di jQuery.

esempio -

(function() { 
    var rosterContainer = document.getElementByID("roster"); 
    var memberContainer = document.createElement("div"); 

    $(memberContainer).addClass("one_fourth alpha hentry") 
        .attr("id", mName.replace(/\s+/g," ")) 
        .appendTo($(rosterContainer)); 
})(); 

b. Puoi anche riprogettare la tua esperienza utente (UX) per i browser IE.

Esempio: il mio sito utilizza pesanti plug-in JS/jquery per caricare sfondi di grandi dimensioni e mostrarli come una presentazione con interpolazioni alfa. Ma per i miei utenti di IE, non carico il JS o il plugin o le immagini di sfondo - mostro solo un bg con titolo statico.

è possibile utilizzare caricatori come yepnope.js per caricare ottimizzato per IE JS

c. Assicurati che l'interfaccia utente del tuo sito sia completamente funzionante senza JavaScript. Questo è sempre un buon punto di partenza.