Du hast deinen AdBlocker an?

Es wäre ein Traum, wenn du ihn für t3n.de deaktivierst. Wir zeigen dir gerne, wie das geht. Und natürlich erklären wir dir auch, warum uns das so wichtig ist. Digitales High-five, deine t3n-Redaktion

Software & Infrastruktur

Performance für Einsteiger, Teil 4: Dein Server kann mehr

Speed Humps. (Foto rachelvoorhees, Flickr)

In unserer Performance-Einsteiger-Serie verraten wir dir, was es bei der Arbeit mit Webseiten zu beachten gilt und wie du leicht selbst die Performance deiner Projekte verbessern kannst. Heute beleuchten wir alles rund um den Server.

Im letzten Teil der Wochenserie haben wir uns mit der Reduktion der Datenmenge und einer besseren Performance in Bezug auf das „Rendering“ im Browser beschäftigt. Heute nehmen wir einige Optimierungsmöglichkeiten auf Seiten des Servers (Apache) unter die Lupe.

Komprimierung für eine bessere Performance

Dass Dateien, die komprimiert werden, allgemein gesehen kleiner sind, sollte ja weitläufig bekannt sein. Auch deine Webseite kann von Datenkompression profitieren. Hierfür werden ausgewählte Ressourcen komprimiert an den Client verschickt. So belasten sie die Leitung deutlich weniger als unkomprimierte Daten.

Aber Achtung: Nicht immer führt Kompression zu einer Reduktion der jeweiligen Daten. Schon komprimierte Dateien wie JPEG-Dateien, PDF-Dateien oder sehr kleine Dateien könnten nach der Kompression eher größer werden, da der bei der Kompression entstehende Daten-Overhead die Einsparung durch die Kompression überwiegt. Ein weiterer Faktor, der nicht vernachlässigt werden sollte, ist die CPU-Zeit, die serverseitig für die Kompression und clientseitig für die Dekompression der Daten benötigt wird. Hier kommt es auf Tests an. In der Regel aber sollte die Kompression von Textinhalten wie HTML, CSS und JavaScript grundsätzlich einen Geschwindigkeitsvorteil mit sich bringen.

Wie aktiviere ich „deflate“?

Aber eins nach dem anderen. Erst mal aktivieren wir mod_deflate auf dem Server und sehen uns in den Browsertools an, welche Auswirkungen das Hinzuschalten der Kompression auf die Daten hat. Es gibt verschiedene Methoden zur Aktivierung des Moduls. Da die Aktivierung via .htaccess die einfachste und bei den meisten Webspace-Anbietern auch eine zugelassene Methode ist, stelle ich euch diese hier vor. Hierfür hinterlegen wir im Root-Verzeichnis eine .htaccess mit folgendem Inhalt:

<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/plain text/html text/xml
AddOutputFilterByType DEFLATE text/css text/javascript
AddOutputFilterByType DEFLATE application/xml application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript application/x-javascript
</IfModule>

Mit diesem Code überprüfen wir zuerst, ob das Modul installiert ist, damit die nachfolgenden Einstellungen beim Fehlen des Moduls keinen 500er-Fehler produzieren. Im Anschluss aktivieren wir die Komprimierung für HTML, CSS, JavaScript und weitere textbasierte Dateiformate. Mit den Browser-Tools können wir jetzt überprüfen, ob die Kompression aktiviert ist und welche Einsparungen durch die Anwendung von „deflate“ erzielt werden konnten. Die erste Grafik zeigt den Aufruf einer Test-Webseite mit deaktivierter Komprimierung. Die zweite Grafik stellt den Aufruf der selben Seite mit aktivierter Komprimierung dar.

Webseite unkomprimiert
Aufruf einer Test-Webseite ohne aktivierter serversetiger Komprimierung. (Screenshot: t3n)
Webseite komprimiert
Bessere Performance: Aufruf einer Test-Webseite mit aktivierter serversetiger Komprimierung. (Screenshot: t3n)

Es ist sofort sichtbar, dass sich die übertragene Datenmenge stark verringert hat, während die Latenz durch die längere Verarbeitungszeit ansteigt und so die durch die verkürzte Download-Zeit gewonnene Performance relativiert. Die starke Reduktion der Dateigröße sollte aber im Einsatz mit mobilen Geräten für einen beachtlichen Performance-Gewinn sorgen können.

Mit Hilfe der Browser-Tools kannst du jederzeit überprüfen, wie stark die Auswirkungen der Kompression auf das Gesamtergebnis sind. Auch die Überprüfung der Auswirkungen auf das jeweilige Element sind mit den Informationen aus den Browser-Tools problemlos möglich.

Cookies sind nicht für Romane gedacht

Auch wenn du dich normalerweise nur auf die Arbeit im Frontend beschränken solltest, wirst du bestimmt schon mal über den Tellerrand hinaus geschaut und selbst eine kleine Web-App programmiert haben. Eine sehr häufiges Fehlerpotential stellen hier die Cookies dar. Einige Webworker speichern ganze Romane in den Cookies und blähen sie damit unnötig auf. Was viele nicht wissen: Cookies werden bei jedem Verbindungsaufbau mitgesendet – also auch wenn ich Bilder oder Skripte runterlade. So wird die Menge der unnötig übertragenen Daten zusätzlich erhöht.

Der beste Umgang mit diesem Problem ist die Auslagerung der Daten ins Backend deiner Anwendung. Verwende die Cookies nur zum Speichern von Session-Informationen wie zum Beispiel der ID. Hole dir die zur Session gehörenden Daten aus einer Datenbank auf deinem Server. So kannst du Overhead reduzieren und die Performance noch mal steigern.

Eine weitere Möglichkeit, um den Cookie-Overhead zu reduzieren, ist der Einsatz von so genannten cookiefreien Domänen. Lieferst du zum Beispiel Grafiken aus, ist es normalerweise nicht nötig, den Benutzer in irgendeiner Form zu verifizieren. Rufst du die Grafiken über eine separate Domain wie „static.deineseite.de“ ab und verzichtest darauf, Cookies zu setzen, kann das in einem zusätzlichen Performance-Boost resultieren. Außerdem erhöhst du so zusätzlich die Parallelität (gleichzeitige Downloads von Ressourcen) deines Browsers.

Bitte beachte unsere Community-Richtlinien

Eine Reaktion
Dima

In dem Zusammenhang wäre auch LiteSpeed einen Blick wert, welcher als "Apache Drop-in Replacement" und äußerst performant beworben wird:
http://www.litespeedtech.com/

Wir konnten den Webserver bisher zwar nur unter Testbedingungen ausprobieren aber unter diesen konnte er sein Versprechen einhalten.

Viele Grüße

Du musst angemeldet sein, um einen Kommentar schreiben zu können.

Jetzt anmelden

Finde einen Job, den du liebst