Internet Explorer 9 Platform Preview 7 disponibile per il download : JavaScript e performance

A sole tre settimane dalla precedente release rilasciata durante la PDC ,  abbiamo già disponibile per il download la Platform Preview 7 di Internet Explorer 9  che potete scaricare da qui . Principale focus di questa preview le performance, tema tra i più importanti di IE9 ed in particolare per questa release  le performance del nuovo motore JavaScript Chakra che sfrutta la compilazione del JS sui core addizionali disponibili sul PC in parallelo all'interprete. Con questa questa preview vengono incrementate ulteriormente le performance di questo importante sottosistema del browser.

Ci si concentra qui sulla parte JS, anche se nello sviluppo di  IE9, relativamente alle performance,  il focus principale è e rimane relativo al miglioramento della risposta del browser nel modo reale dei siti web e non soltanto relativamente al motore JS.   Quando si parla di performance per un browser in molti casi ci si focalizza in particolare sul motore di JavaScript e ci si concentra su microbenchmark che analizzano le performance di questo sottosistema del browser. Spesso capita che venga considerato un browser più veloce rispetto ad un altro dal risultato di questi micro-benchmark,  anche se in realtà la parte JS  è solo uno degli elementi coinvolti nelle performance complessive di un browser.   

Uno di questi microbenchmark tra i più noti e citati per il JavaScript è il WebKit SunSpider . Rispetto alla prima preview pubblica di IE9 le performance del nuovo IE9 JS engine, Chakra misurate in questo microbenchmark  sono migliorate ulteriormente rispetto alla precedente preview ed anche la posizione tra i browser.Di seguito avete i risultati ad oggi del WebKit SunSpider microbenchmark che trovate anche qui :

 

Seppur IE9 è considerato attualmente da questo famoso benchmark tra i browser più veloci, il considerare questo tipo di benchmark di un solo sottosistema come l'indicatore delle performance complessive di un browser non è corretto e non fornisce indicazioni realistiche sulle performance complessive sull'utilizzo in siti ed applicazioni reali .  

 Ad esempio, il motore JavaScript nel mondo reale, viene usato non soltanto per eseguire codice JS ma anche per accedere al DOM, rispondere all'input degli utenti, gestire le animazioni sugli elementi grafici e molto altro. Tutti questi elementi relativi all'uso dell'engine JS nel mondo reale,  non vengono valutati e misurate dal microbenchmark precedente, che viene fatto senza input utente, senza UI senza interazione con il DOM etc. e che quindi oltre a non valutare gli altri sottosistemi del browser, non considera nemmeno l'utilizzo del motore JS in condizioni reali. L'approccio alle performance in IE9 è invece complessivo , su tutti i sottositemi, dalle ottimizzazioni fatte sul networking, all'accelerazione grafica completa nel rendering che consente di sfruttare la GPU , alle ottimizzazioni del nuovo engine JavaScript(Chakra ) che combina compilazione e l'interprete sfruttando anche le CPU multicore e ottimizzando le interazioni con il DOM.

   Come dicevo anche sopra, quando si parla di performance nel modo reale significa essenzialmente confrontarsi con il comportamento del browser rispetto all'utilizzo su siti reali e non verso benchmark parziali. In questo scenario tutti i sottosistemi del browser sono coinvolti, dalla parte di networking agli aspetti collegati al rendering della pagina Web e la parte di JavaScript è solo uno degli elementi coinvolti seppur importante.

Per questo motivo per lo sviluppo di IE9 , il team ha analizzato il comportamento delle versioni precedenti del browser proprio per capire come si distribuisce il tempo di caricamento di una pagina sui siti reali esistenti, e determinare su quali elementi agire principalmente per migliorare le perfomance complessive. Quello che è appunto emerso da questi studi è che tutta la catena di sottosistemi che compongono il browser sono importanti nelle performance complessive e potete vedere nella seguente figura le diverse strutture del browser coinvolte nella navigazione su un sito con un impatto significativo sulle performance:

 

Le performance complessive , comprendono anche altri aspetti importanti come il comportamento degli add-in del browser e la possibilità di determinare gli elementi che generano delle problematiche nel funzionamento del browser, la stabilità , il comportamento verso quei siti con codice che produce comportamenti anomali e molto altro.

 Di seguito avete un esempio di grafico che illustra appunto la distribuzione del tempo di caricamento medio dei principali siti che fanno un uso rilevante di uno stile di programmazione AJAX  sui diversi sottositemi del browser:

 

Da questi dati, si vede chiaramente che il motore JavaScript gioca si un ruolo rilevante, ma come in realtà sia altrettanto importante il ruolo degli altri sottosistemi ed in particolare sui siti più moderni,  l'aspetto relativo al rendendering giochi un ruolo fondamentale.

 In questo post sul blog di IE9 trovate ulteriori approfondimenti sulle analisi fatte che evidenziano come tutte le strutture del browser siano coinvolte con il proprio peso nelle performance complessive.

Da queste analisi è partito il grande lavoro su tutti i sottosistemi di IE9 ed in particolare: sul nuovo motore JavaScript, che sfrutta anche la compilazione nativa del codice in parallelo all'interprete JS  e il supporto completo della accelerazione grafica in tutte le fasi del rendering della pagina, che permette ad oggi di avere, in particolare sulle applicazioni HTML5, le migliori performance possibili con il completo sfruttamento della GPU del PC su cui IE9 è in esecuzione.   

Sul tema performance della differenza tra microbenchmark e performance nel modo reale dei siti  vi suggerisco anche di guardare questo video su Channel 9 con Jason Weber (Lead Program Manager in IE team responsabile per le performance del browser).

Disponibili anche su http://www.ietestdrive.com/    una nuova serie di esempi,  costruita proprio per  illustrare le performance complessive che rappresentino il comportamento del browser nel real-world e non con lo stile del microbenchmark.  Oltre agli esempi già noti che abbiamo anche illustrato in alcuni video , sono disponibili nuovi esempi con i quali potete confrontare IE9 PP7 con le recenti Beta di FireFox 4 e Google Chrome e vedere, ad oggi, le differenze che si evidenziano nelle performance  in un approccio pensato per illustrare le performance end to end, rispetto ad un approccio con il focus su un particolare sottosistema:

  • Nell'esempio Shakespeare Tag Cloud , potete vedere il vantaggio di performance prodotto dalla compilazione del JS di cui si avvale IE9 assieme al supporto per ECMAScript5 . IE9 riesce a eseguire la costruzione del tag cloud manipolando il testo con maggiore velocità
  •  Nel HTML5 Sudoku  sample lo stesso supporto per ECMAScript5 combinato con HTML5 Canvas in IE9 permette di eseguire la risoluzione del puzzles con maggiore velocità rispetto agli altri browser
  •  Con l'esempio Galaxy abbiamo il JS compilato assieme alla accelerazione grafica di IE9 che consente di create una scena 3D interattiva con un frame rate ad oggi, significativamente migliore rispetto agli altri browser

Sul blog del team di IE trovate il post della release con anche un video che illustra alcune delle nuove demo del test drive center .

 Ed ora pronti per la prossima release .....

 

 Update -  Ci sono state alcune domande sulle ottimizzazioni apportate al  engine JS di IE9 (Chakra engine) implementate per migliorarne il funzionamento e le performance e che si applicano anche i risultati del microbenchmark WebKit SunSpider .  L'engine JS di IE9 è ottimizzato  come già scritto sopra, per il funzionamento nei siti reali e non per il funzionamento nei microbenchmark e provando i nuovi test che sono su  http://www.ietestdrive.com/    si possono valutare le performance su applicazioni reali e paragonarle anche con gli altri browser. Tra le feature aggiunte al nuovo motore di JS per ottimizzarne il funzionamento per il real world ,c'è anche un'ottimizzazione per la  dead code elimination . Si tratta essenzialmente di una funzionalità che analizza il codice e ne elimina  quelle parti che non hanno influenza sull'esecuzione, per ottimizzarne le dimensioni,  le successive compilazioni e quindi le performance complessive. Questa funzionalità si applica in particolare a quelle parti di codice che sono ripetute all'interno di loop. Per chi è interessato ad approfondire maggiormente questo aspetto trova le informazioni su questa funzionalità e chiarimenti su  come si applica nel microbenchmarck  sul post del blog di IE9 in fondo al post nell'area titolata appunto Dead Code Elimination in JavaScript .