Nach der Installation der Erweiterung GTspeed und dem Setzen der ersten Optionen – siehe hier – nehme ich mir heute die integrierte Bildoptimierung im Detail vor.
Die Erweiterung bringt für verschiedene Grafikformate einige Skripte und fertige Binaries mit (gifsicle, jpegoptim, optipng), die alle im Verzeichnis /pfad/zu/magento/lib/gtspeed/elf32/ abgelegt sind. Leider fanden sich auf Anhieb keine Informatioenn zu den eingesetzten Versionen weshalb ich mich dazu entschloss, einfach die Neuesten selbst herunterzuladen und zu kompilieren. Dazu wird ein SSH-Zugang auf dem Account/Server benötigt.
1) jpegoptim installieren
Per SSH verbinden, in das Magento-Verzeichnis /lib/gtspeed/elf32 wechseln und das Paket herunterladen. Anschließend entpacken und die Rechte anpassen, da es ansonsten zu Fehlermeldungen kommen kann. Ich setze die Rechte einfach auf “unsichere” 777, da am Ende nur das fertige Binary behalten wird und der Rest gelöscht wird, stellt das auch kein Problem dar. Unter Angabe des absoluten Serverpfades wird schließlich jpegoptim konfiguriert und installiert.
wget http://www.kokkonen.net/tjko/src/jpegoptim-1.2.4.tar.gz (Rechte anpassen, 777) cd jpegoptim-1.2.4 mv _aux aux ./configure --prefix=/pfad/zu/magento/lib/gtspeed/elf32/jpegoptim-1.2.4 make && make strip make install
Ist der Vorgang erfolgreich liegt am Ende im Verzeichnis /bin eine Datei “jpegoptim” die dann herauskopiert wird und die alte in /gtspeed/elf32 ersetzt. Abschließend löschen wir das Verzeichnis “jpegoptim-1.2.4” sowie die heruntergeladene Datei “jpegoptim-1.2.4.tar.gz”.
2) gifsicle installieren
Der Ablauf erfolgt analog zu oben: Per SSH verbinden, in das Magento-Verzeichnis /lib/gtspeed/elf32 wechseln und das Paket herunterladen. Anschließend entpacken und die Rechte anpassen, da es ansonsten zu Fehlermeldungen kommen kann. Unter Angabe des absoluten Serverpfades wird schließlich gifsicle konfiguriert und installiert:
wget http://www.lcdf.org/gifsicle/gifsicle-1.64.tar.gz tar zxvf gifsicle-1.64.tar.gz (Rechte anpassen, 777) cd gifsicle-1.64 ./configure --prefix=/pfad/zu/magento/lib/gtspeed/elf32/gifsicle-1.64 make && make check make install
Im Verzeichnis /bin innerhalb des gifsicle-Verzecihnisses liegt schließlich eine Datei “gifsicle” die wir kopieren und damit die vorhandene in /lib/gtspeed/elf32 ersetzen. Abschließend löschen wir das Verzeichnis “gifsicle-1.64” sowie die heruntergeladene Datei “gifsicle-1.64.tar.gz”.
3) optipng installieren
Auch für die Installation von optipng ist ein SSH-Account erforderlich und das Vorgehen erfolgt analog zu den bisherigen Beiden:
wget http://prdownloads.sourceforge.net/optipng/optipng-0.6.5.tar.gz tar zxvf optipng-0.6.5.tar.gz (Rechte anpassen, 777) cd optipng-0.6.5/ ./configure --prefix=/pfad/zu/magento/lib/gtspeed/elf32/optipng-0.6.5 make && make install
Ist auch dieser Vorgang erfolgreich, so liegt im Verzeichnis /bin eine Datei “optipng” die bitte herauskopiert wird und die alte in /elf32 ersetzt. Abschließend werden das Verzeichnis “optipng-0.6.5” sowie die heruntergeladene Datei “optipng-0.6.5.tar.gz” noch gelöscht.
4) Image Optimization starten
Nun zur eigentlichen Aktivierung der Funktion zur Optimierung von Grafikdateien in GTspeed. Nach dem Login in Magento und Aufruf über System -> GT -> GTspeed sollte im Bereich “Image Optimization” zunächst die Schaltfläche zum neu einlesen der Grafikdateien angeklickt werden. In meiner Testinstallation wurden rund 1760 Dateien erkannt. Die Optimierung wird bei dieser Anzahl somit einige Zeit in Anspruch nehmen (ca. 2 Minuten) und wir führen diese über den Klick auf “Optimize Images” aus.
Magento Speedtest mit aktivem GTspeed
Nach dem Abschluss des Vorgangs wurde die zu übertragene Datenmenge beim Aufruf des Shops nocheinmal deutlich reduziert sein, was sich in Benchmarks auch direkt positiv äußert. Der Page Speed Grade kletterte um satte 10 Punkte und auch bei YSLow gibt es nun ein A statt einem guten B. Die zu übertragende Datenmenge verringerte sich bei der Startseite zwar nur um wenige KB, der Seitenaufbau insgesamt aber ist 50% schneller.
Magento Speedtest nach Image Optimization
Diese Ergebnisse sind natürlich nur theoretisch, da die Seite keine echten Artikel enthält und dienen nur als Anhaltspunkt der verbesserten Performance.
