Wie optimiere ich Zugriff auf JavaScript (White Spaces, Kommentare, …)?



In einem ersten Schritt solle der JavaScript Code aus der Webseite in eine eigene Datei ausgelagert werden. Ist dies geschehen kann diese Datei vom Browser gecacht werden und braucht nicht bei jedem Zugriff erneut geladen werden. Überprüft werden kann das mit Tools wie Fiddler welche den HTTP-Traffic anzeigen und so aufdecken welche Dateien beim Zugriff auf eine Webseite wirklich abgerufen werden.


Fiddler im Einsatz

Fiddler Icon Referenz


Danach gilt es die gerade erzeugte JavaScript Datei zu optimieren. Mögliche Optionen sind



  • Kommentare entfernen

  • White Spaces (Leerzeichen, Zeilenumbrüche, …)

  • Variablen kürzen


Glücklicherweise gibt es Tools die diese Arbeit (zumindest das Entfernen von White Spaces und Kommentaren) übernehmen 🙂



Als Beispiel ein kleiner Codeschnipsel aus www.woistdaniel.de







// JScript File


// holds the Virtual Earth Map


var map = null;


function LoadMap() {


if (map == null)


{


map = new VEMap(‘myMap’);


map.LoadMap();


map.SetMapStyle(‘r’);


}


}


vs.







var map=null;function LoadMap(){if(map==null){map=new VEMap(‘myMap’);map.LoadMap();map.SetMapStyle(‘r’)}}


Vor der Optimierung: 223 Bytes,
Nach der Optimierung: 107 Bytes


Ersparnis: 52,02% :-))


Schöne Grüße


Daniel

Comments (0)