Whitepaper zur Performance-Optimierung mit OXID

Transcription

Whitepaper zur Performance-Optimierung mit OXID
Whitepaper
OXID eSales
Performance-Optimierung
OXID eShop
© OXID eSales AG | www.oxid-esales.com | info@oxid-esales.com | Version 1.0.1
Whitepaper
Copyright
Copyright © 2011 OXID eSales AG, Deutschland
Die Vervielfältigung dieses Dokuments oder Teilen davon, insbesondere die Verwendung von
Texten oder Textteilen bedarf der ausdrücklichen vorherigen Zustimmung der OXID eSales
AG.
Eine Dekompilierung des Quellcodes, unerlaubte Vervielfältigung sowie die Weitergabe an
Dritte ist nicht gestattet.
Zuwiderhandlungen werden ausnahmslos zur Anzeige gebracht und strafrechtlich verfolgt.
Die alleinigen Rechte an der Software sowie an diesem Dokument liegen ausschließlich bei der
OXID eSales AG.
Die in diesem Dokument bereit gestellten Informationen wurden nach aktuellem Stand der
Technik verfasst. Die OXID eSales AG übernimmt jedoch keine Haftung oder Garantie für
die Aktualität, Richtigkeit und Vollständigkeit der bereit gestellten Informationen. Da sich
Fehler, trotz aller Bemühungen nie vollständig vermeiden lassen, sind wir für Hinweise
jederzeit dankbar.
Konventionen
In diesem Dokument werden die folgenden typographischen Konventionen verwendet:
Grau hinterlegte Proportionalschrift
Für Benutzereingaben, Quellcode und URLs
Graue Kursivschrift
Für Dateinamen und Pfade und sonstige kursive Auszeichnungen
Fettschrift
Für Eingabefelder und Navigationsschritte
Fettschrift dunkelrot
Für Warnungen und wichtige Hinweise
Impressum
OXID eSales AG
Bertoldstraße 48
79098 Freiburg
Deutschland
Fon: +49 (761) 36889 0
Fax: +49 (761) 36889 29
Vorstand: Roland Fesenmayr (Vorsitzender), Andrea Seeger
Vorsitzender des Aufsichtsrats: Harald Fuchs
Sitz: Freiburg
Amtsgericht Freiburg i. Brg.
HRB 701648
2/11
© OXID eSales AG | www.oxid-esales.com | info@oxid-esales.com | Version 1.0.1
Whitepaper
Inhaltsverzeichnis
Copyright .......................................................................................................................................................2
Konventionen ..................................................................................................................................................2
Impressum .....................................................................................................................................................2
Inhaltsverzeichnis ............................................................................................................................................3
1
Vorbemerkungen ......................................................................................................................................4
1.1
2
3
4
5
.htaccess .........................................................................................................................................4
Apache Modul mod_expires.c .....................................................................................................................4
2.1
Inhalt für .htaccess ...........................................................................................................................4
2.2
Erläuterung der Einstellungen ............................................................................................................5
Apache Modul mod_headers.c ....................................................................................................................6
3.1
Inhalt für .htaccess ...........................................................................................................................6
3.2
Erläuterung der Einstellungen ............................................................................................................7
Apache Modul mod_deflate.c ......................................................................................................................7
4.1
Inhalt für .htaccess ...........................................................................................................................8
4.2
Erläuterung der Einstellungen ............................................................................................................8
Bilder auslagern auf Subdomain .................................................................................................................8
5.1
config.inc.php ..................................................................................................................................8
5.2
Serveradministration ........................................................................................................................8
6
Vollständige, optimierte .htaccess ...............................................................................................................9
7
Weitere Möglichkeiten zur Performance-Optimierung ................................................................................... 11
8
Quellen und weiterführende Links ............................................................................................................. 11
3/11
© OXID eSales AG | www.oxid-esales.com | info@oxid-esales.com | Version 1.0.1
Whitepaper
1 Vorbemerkungen
Dieses Whitepaper erläutert, die optimalen Servereinstellungen für den OXID eShop. Alle Angaben
beziehen sich auf Webhostings bei Profihost (https://www.profihost.com/webspace/).
Auch alle anderen von OXID eSales ausgewählten Hosting Partner (http://www.oxidesales.com/de/partner/solution-partner/hosting) unterstützen Sie bei der Umsetzung.
1.1
.htaccess
Die .htaccess ist eine Konfigurationsdatei des Apache Webservers die es erlaubt, die Konfiguration des
Webservers (für ein bestimmtes Verzeichnis) zu editieren. Hierdurch werden, wie im Folgenden
beschrieben, das Caching und der Request-Header optimiert.
Dieses Beispiel geht davon aus, dass der OXID eShop unter http://www.ihroxideshop.de läuft, also
direkt im Web-Root des Hosting Paketes und nicht in einem Unterverzeichnis. Die hier vorgestellten
Maßnahmen finden also Anwendung in der .htaccess-Datei im Verzeichnis: /www.ihroxideshop.de.
Der OXID eShop wird bereits mit einer .htaccess ausgeliefert. Diese Datei wird mit einem einfachen
Text-Editor bearbeitet. Bitte vergewissern Sie sich dass Sie ein Backup der Datei erstellen bevor Sie mit
den Anpassungen beginnen, um bei unerwünschten Nebeneffekten unmittelbar das Original
wiederherstellen zu können.
Es können Überschneidungen mit definierten Regeln und Kaskaden-Effekte auftreten, wenn Sie bereits
Ihre .htaccess angepasst haben, bitte prüfen Sie daher die vorgenommenen Einstellungen vor der
Livestellung.
2 Apache Modul mod_expires.c
Dieses Apache Modul kontrolliert die Einstellungen der Gültigkeitsdauer von Elementen, die im Response
Header mitgeschickt werden.
Im Beispiel wird die Gültigkeit von Bildern verlängert um ein erneutes Laden zu verhindern.
2.1
Inhalt für .htaccess
<IfModule mod_expires.c>
ExpiresActive On
ExpiresDefault "access plus 1 seconds"
ExpiresByType image/x-icon "access plus 604800 seconds"
ExpiresByType image/jpeg "access plus 604800 seconds"
ExpiresByType image/png "access plus 604800 seconds"
ExpiresByType image/gif "access plus 604800 seconds"
4/11
© OXID eSales AG | www.oxid-esales.com | info@oxid-esales.com | Version 1.0.1
Whitepaper
ExpiresByType image/ico "access plus 604800 seconds"
ExpiresByType application/x-shockwave-flash "access plus 432000 seconds"
ExpiresByType text/css "access plus 432000 seconds"
ExpiresByType text/javascript "access plus 432000 seconds"
ExpiresByType application/x-javascript "access plus 432000 seconds"
ExpiresByType text/html "access plus 600 seconds"
ExpiresByType application/xhtml+xml "access plus 600 seconds"
</IfModule>
2.2
Erläuterung der Einstellungen
Die Bedingung <IfModule mod_expires.c>[..]</IfModule> macht die Anweisung in der .htaccess
robuster. Falls das Modul auf dem Server nicht aktiv sein sollte, so wird kein Fehler ausgelöst, der den
Shop offline schalten würde. Die Anweisung bleibt so ohne schädlichen Einfluss.
ExpiresActive On
Diese Anweisung sorgt dafür dass der Server die Resultate der folgenden Einstellungen auch im Header
der Serverantwort sendet. Als Wert kann hier nur On oder Off angegeben werden.
ExpiresDefault "access plus 1 seconds"
Diese Anweisung sagt aus, dass alle nicht weiter spezifizierten Antworten mit einer Gültigkeitsdauer von
1 Sekunde ab der Anfrage versehen werden.
Die Dauer kann in folgender Syntax angegeben werden: "BASE plus 1234 TYPE".
BASE Kann hierbei folgende Werte annehmen:

access1

now1

modification2
TYPE Kann in

Years

Months

Weeks

Days

Hours

Minutes

Seconds
angegeben werden. So ergeben sich folgende drei Beispiele:
1
2
Zugriffszeitpunkt
Zeitpunkt an dem z.B. das Bild bearbeitet wurde
5/11
© OXID eSales AG | www.oxid-esales.com | info@oxid-esales.com | Version 1.0.1
Whitepaper

ExpiresDefault "access plus 1 weeks"3

ExpiresDefault "modification plus 6 months"

ExpiresDefault "modification plus 86400 seconds"4
ExpiresByType image/x-icon "access plus 604800 seconds"
ExpiresByType MIME-type "Zeitangebe wie zuvor"
Dies ist der generelle Aufbau, der Cache-Control-Steuerung. Der MIME-type definiert, für welche Art von
Dokumenten die Regel gelten soll. So werden hier Zeiten für das übermittelte HTML, für CSS und
Javascript, verschiedene Bilder sowie für Flash definiert. Auch eine Definition für PDF Dokumente ist
möglich:
ExpiresByType application/pdf "access plus 604800 seconds"
Zu den Mime-type Definitionen für weitere Medien Typen siehe:
http://www.iana.org/assignments/media-types/
3 Apache Modul mod_headers.c
Das Apache Module „mod_headers.c” ermöglicht die Manipulation des Requests und Response Header des
Servers. Editieren der Cache-Control-Einstellungen bringt in Zusammenarbeit mit den zuvor gesetzten
Gültigkeitsdauern den gewünschten Performance-Schub.
Dokumente müssen so nicht vom Server nachgeladen werden, sondern können aus dem lokalen BrowserCache wiederverwendet werden. Die Menge der zu übertragenden Daten reduziert sich hierdurch
erheblich.
3.1
Inhalt für .htaccess
<ifModule mod_headers.c>
<filesMatch "\\.(ico|pdf|flv|jpg|jpeg|png|gif|swf)$">
Header set Cache-Control "max-age=2592000, public"
</filesMatch>
<filesMatch "\\.(css)$">
Header set Cache-Control "max-age=604800, public"
</filesMatch>
<filesMatch "\\.(js)$">
Header set Cache-Control "max-age=216000, private"
</filesMatch>
<filesMatch "\\.(xml|txt)$">
Header set Cache-Control "max-age=216000, public, must-revalidate"
</filesMatch>
3
4
auch bei einer Woche muss es „1 weeks“ heißen
Angabe in Sekunden ist üblich. 86400 Sekunden entsprechen 1 Tag. S. a.
http://httpd.apache.org/docs/2.2/mod/mod_expires.html
6/11
© OXID eSales AG | www.oxid-esales.com | info@oxid-esales.com | Version 1.0.1
Whitepaper
<filesMatch "\\.(html|htm|php)$">
Header set Cache-Control "max-age=1, private, must-revalidate"
</filesMatch>
Header unset ETag
Header unset Last-Modified
</ifModule>
FileETag None
3.2
Erläuterung der Einstellungen
<ifModule mod_headers.c>[..]</ifModule>
Wie zuvor im Abschnitt über mod_expires.c werden die umschlossenen Konfigurationen nur
berücksichtigt sofern das Apache Modul mod_headers.c verfügbar ist.
<filesMatch "\\.(ico|pdf|flv|jpg|jpeg|png|gif|swf)$">[..]</filesMatch>
Die im filesMatch-Tag notierten Datei-Typen stellen sicher dass die umschlossenen Anweisungen nur
auf die genannten Dokumente angewendet werden. In diesem Beispiel wird die Anweisung auf Bilder und
Flash-Dateien beschränkt.
<filesMatch "\\.(ico|pdf|flv|jpg|jpeg|png|gif|swf)$">
Header set Cache-Control "max-age=2592000, public"
</filesMatch>
Diese Anweisung (Cache-Control) setzt die Cache-Lebenszeit für das Dokument auf 2.592.000 Sekunden
(= 30 Tage). Die Angabe public oder private ist optional und sagt aus, dass das Dokument auch
anderen User zur Verfügung gestellt werden kann (public) oder aber nur für einen spezifischen User
ausgeliefert werden darf (private).
Durch das Setzen von FileETag None sowie dem Eintrag Header unset Last-Modified liefert der
Server keine Validierung für Dateien aus. Der Server sendet also keinen 304 Status zurück. Das hat als
Konsequenz, dass das oben definierte Caching greift und das Dokument bis zum Ende der Gültigkeit nicht
erneut angefragt wird. Dies spart nicht nur die Bandbreite ein, sondern unterdrückt den Request
komplett.
Siehe auch:
http://httpd.apache.org/docs/2.2/mod/mod_headers.html
http://httpd.apache.org/docs/2.2/mod/core.html#fileetag
4 Apache Modul mod_deflate.c
Über das Server Modul mod_deflate kann eine Komprimierung der vom Server übermittelten Daten
erzwungen werden. Siehe auch http://httpd.apache.org/docs/2.2/mod/mod_deflate.html
7/11
© OXID eSales AG | www.oxid-esales.com | info@oxid-esales.com | Version 1.0.1
Whitepaper
4.1
Inhalt für .htaccess
<IfModule mod_deflate.c>
<FilesMatch "\.(css|js|x?html?|php)$">
SetOutputFilter DEFLATE
</FilesMatch>
</IfModule>
4.2
Erläuterung der Einstellungen
Wie bei den vorherigen Einstellungen wird Wirksamkeit dieses AusgabeFilter auf bestimme Dateien
beschränkt: <FilesMatch "\.(css|js|x?html?|php)$">. Die im OXID eShop hinterlegten Javascript,
Stylsheets (CSS), HTML Dateien sowie Ausgaben von PHP Skripten werden komprimiert an den Client
weitergegeben: SetOutputFilter DEFLATE.
Dies spart Bandbreite, die Daten werden schneller zum Browser übermittelt und Ihr OXID eShop wird
schneller geladen.
5 Bilder auslagern auf Subdomain
Die maximale Anzahl an gleichzeitigen Verbindungen, die der Browser zum Server aufbaut, ist
üblicherweise begrenzt. Um die Seite möglichst effizient und schnell zu laden, wird daher zu einem
kleinen Trick gegriffen und die Bilder werden über eine Subdomain geladen. Die Subdomain wirkt als
eigener Host. Somit ist die Anzahl an Verbindungen, über die gleichzeitig Inhalte übertragen werden,
verdoppelt worden.
Wie unter: http://www.die.net/musings/page_load_time/ zu sehen ist, schafft dieser Effekt besonders
bei kleinen Dateigrößen, wie sie im OXID eShop vorliegen, einen großen Zugewinn an Geschwindigkeit.
5.1
config.inc.php
In der Konfigurationsdatei Ihres OXID eShops (config.inc.php im Wurzelverzeichnis Ihres Webshops),
können Sie einen alternativen Pfad für Ihre Bilder angeben. Hier wird eine Subdomain definiert, über die
die Produktbilder geladen werden. An der Verzeichnisstruktur, oder an der Shop-Programmierung sind
keine Änderungen notwendig. Die Bilderpflege und der Upload über Ihr Online Shop Backend funktioniert
wie gewohnt.
Diese Zeile in Ihrer config.inc.php anhängen:
//define imagedir via subdomain, which points to the original image folder
$this->sAltImageDir = "http://pictures.demoshophost.de/";
5.2
Serveradministration
Im Admin-Bereich Ihres Profihost Accounts (http://server[XXX]-han.de-nserver.de/admin/) finden Sie
links den Navigationspunkt Subdomains.
8/11
© OXID eSales AG | www.oxid-esales.com | info@oxid-esales.com | Version 1.0.1
Whitepaper
Tragen Sie als Subdomain wie in unserem Beispiel hier pictures ein und lassen Sie die Subdomain auf
den Bilder Ordner Ihres Shops zeigen, in unserem Beispiel: www.demoshophost.de/out/pictures/.
Alle Bilder sind nun auch über die Subdomain verfügbar und werden nun über die Subdomain
http://pictures.demoshophost.de vom Shop geladen.
6 Vollständige, optimierte .htaccess
<IfModule mod_expires.c>
ExpiresActive On
ExpiresDefault "access plus 1 seconds"
ExpiresByType image/x-icon "access plus 604800 seconds"
ExpiresByType image/jpeg "access plus 604800 seconds"
ExpiresByType image/png "access plus 604800 seconds"
ExpiresByType image/gif "access plus 604800 seconds"
ExpiresByType image/ico "access plus 604800 seconds"
ExpiresByType application/x-shockwave-flash "access plus 432000 seconds"
ExpiresByType text/css "access plus 432000 seconds"
ExpiresByType text/javascript "access plus 432000 seconds"
ExpiresByType application/x-javascript "access plus 432000 seconds"
ExpiresByType text/html "access plus 600 seconds"
ExpiresByType application/xhtml+xml "access plus 600 seconds"
</IfModule>
<ifModule mod_headers.c>
<filesMatch "\\.(ico|pdf|flv|jpg|jpeg|png|gif|swf)$">
Header set Cache-Control "max-age=2592000, public"
</filesMatch>
<filesMatch "\\.(css)$">
Header set Cache-Control "max-age=604800, public"
</filesMatch>
<filesMatch "\\.(js)$">
Header set Cache-Control "max-age=216000, private"
9/11
© OXID eSales AG | www.oxid-esales.com | info@oxid-esales.com | Version 1.0.1
Whitepaper
</filesMatch>
<filesMatch "\\.(xml|txt)$">
Header set Cache-Control "max-age=216000, public, must-revalidate"
</filesMatch>
<filesMatch "\\.(html|htm|php)$">
Header set Cache-Control "max-age=1, private, must-revalidate"
</filesMatch>
Header unset ETag
Header unset Last-Modified
</ifModule>
FileETag None
<IfModule mod_deflate.c>
<FilesMatch "\.(css|js|x?html?|php)$">
SetOutputFilter DEFLATE
</FilesMatch>
</IfModule>
<IfModule mod_rewrite.c>
Options +FollowSymLinks
RewriteEngine On
RewriteCond %{REQUEST_URI}
!(\/core\/|\/export\/|\/modules\/|\/out\/|\/setup\/|\/tmp\/|\/views\/)
RewriteRule admin/test\.php$ admin/test.php?mod_rewrite=1
RewriteCond %{REQUEST_URI}
!(\/admin\/|\/core\/|\/export\/|\/modules\/|\/out\/|\/setup\/|\/tmp\/|\/views\/)
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule !(\.html|\/|\.jpg|\.css|\.pdf|\.doc|\.gif|\.png|\.js)$ %{REQUEST_URI}/
[R=301,L]
RewriteCond %{REQUEST_URI}
!(\/admin\/|\/core\/|\/export\/|\/modules\/|\/out\/|\/setup\/|\/tmp\/|\/views\/)
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule (\.html|\/)$ oxseo.php
</IfModule>
# disabling log file access from outside
<FilesMatch "(EXCEPTION_LOG\.txt|\.log$|\.tpl$)">
order allow,deny
10/11
© OXID eSales AG | www.oxid-esales.com | info@oxid-esales.com | Version 1.0.1
Whitepaper
deny from all
</FilesMatch>
Options -Indexes
7 Weitere Möglichkeiten zur Performance-Optimierung
Sie können den Subdomain-Trick auch für das CSS sowie JavaScript anwenden. Hierzu müssen Sie eine
Subdomain (z.B. css.demoshophost.de) definieren, die genau auf den verwendeten Template Ordner
zeigt:
/www.demoshophost.de/out/basic/src bzw.
/www.demoshophost.de/out/[CUSTOM_TEMPLATE]/src
Bitte beachten Sie, dass Sie seit Version 4.2.0 nun auch Custom Templates
(http://wiki.oxidforge.org/index.php?title=Downloads/4.2.0#New_Features) verwenden können
und somit der Pfad der verwendeten CSS/JavaScript Datei nun nicht mehr im Verzeichnis basic liegen
muss.
Im der Template Datei /www.demoshophost.de/out/basic/tpl _header.tpl müssen sie nun das
CSS/JavaScript statisch über die definierte Subdomain einbinden.
Hier am Beispiel des CSS:
<link rel="stylesheet" type="text/css" href="[{ $oViewConf->getResourceUrl() }]oxid.css">
<link rel="stylesheet" type="text/css" href="http://css.demoshophost.de/oxid.css">
8 Quellen und weiterführende Links
http://www.askapache.com/htaccess/speed-up-sites-with-htaccess-caching.html
http://www.samaxes.com/2008/04/htaccess-gzip-and-cache-your-site-for-faster-loading-andbandwidth-saving/
http://www.die.net/musings/page_load_time/
http://httpd.apache.org/docs/2.2/
https://www.profihost.com/
http://www.oxid-esales.com/de/partner/solution-partner/hosting
11/11
© OXID eSales AG | www.oxid-esales.com | info@oxid-esales.com | Version 1.0.1