Pagespeed

Javascript-Dateien kombinieren

Die Ladezeit einer Webseite hängt sehr stark von der Anzahl der http Requests ab, sowie der damit verbundenen Größen der benötigten Dateien (CCS, Javascript, Bilder, etc.). Da aktuelle und moderne Webseiten kaum noch auf JavaScript und den damit einhergehenden AJAX-Features verzichten könnten, werden bei dem Aufruf einer solchen Webseite oft mehrere JavaScript Dateien geladen. Da jede Javascript-Datei einen http Requests erzeugt, kann hier angesetzt und die Anzahl der http Requests, sowie damit die Ladezeit optimiert werden.
Der Analysepunkt Javascript Dateien kombinieren steht sowohl für extern eingebundene JavaScript-Dateien (z.B. mittels API oder über CDNs) als auch für eigene, auf dem Server befindliche Dateien. Um diese miteinander zu kombinieren gibt es verschiedene Varianten.

Variante 1: Manuelles Zusammenfassen aller Javascript Dateien
Wenn es programmtechnisch möglich ist, dann können mehrere (oder auch alle) Javascript-Dateien zu einer einzigen zusammengefasst werden. Kopiert dazu den kompletten Code aus jeder einzelnen Javascript-Datei und fügt diesen dann in eine andere Javascript Datei ein (nennt diese dann z.B. global.js). Speichern, hochladen, testen, fertig. (Unbedingt die Funktionalität der Webseite und deren Javascript-Features testen).
Achtung: Kopiert die einzelnen Javascript-Dateien in der Reihenfolge der Einbindung aus dem Quelltext in die globale Javascript-Datei! Sonst funktioniert eventuell nichts mehr!
Um dieses Problem nicht nachträglich lösen zu müssen, sollten Programmierer bereits bei der Erstellung einer neuen Webseite darauf hingewiesen werden die Anzahl der http Requests zu minimieren.
Sollten die Funktionen auf der Webseite nach der manuellen Zusammenfassung der JavaScript Dateien nicht mehr fehlerfrei funktionieren, dann bitte nachfolgende Variante 2 testen.

Variante 2: JavaScript kombinieren mittels .htaccess und PHP
Auf der Webseite +rakaz.nl – compress JS und CSS gibt es ein kleines Script, bestehend aus einer PHP Datei und einigen .htaccess-Codezeilen, welches es Euch ermöglicht mehrere JavaScript Dateien automatisch zu einer einzigen Datei zusammenzufassen und diese gleichzeitig mittels GZIP zu komprimieren.
Ladet Euch dazu die entsprechende Datei herunter, passt darin eventuell den Pfad zu den JS Dateien an. Fügt Eurer .htaccess Datei die Codezeilen hinzu, ladet diese Dateien auf den Server hoch und passt anschließend im Quellcode die Zeilen zum Aufruf der Javascript Dateien an.
Beispiel: So wird aus
<script type="text/javascript" language="javascript" src="jquery-1.4.2.min.js"</script>
<script type="text/javascript" language="javascript" src="cufon-yui.js"</script>
>script type="text/javascript" language="javascript" src="global.js"<;/script>

dann
<script type="text/javascript" language="javascript" src="jquery-1.4.2.min.js,cufon-yui.js,global.js"</script>
Fertig.
Damit werden die vielen einzelnen Javascript Dateien zu einer einzigen zusammengefügt, geladen (nur noch ein http Request) und gleichzeitig mittels GZIP komprimiert (wenn die auf dem Server aktiviert ist).
Wenn alles fehlerfrei funktioniert ist der Punkt JavaScript-Dateien kombinieren gelöst.

1 Star2 Stars3 Stars4 Stars5 Stars (Noch keine Bewertung)
Loading...

Kommentar verfassen