Schneller, höher, weiter

Teil 7: Homepage-Optimierung: Geringe Ladezeiten, gute Performance

Ajax

Web 2.0 und Ajax sind die beiden beherrschenden Schlagwörter der letzten Jahre. Webseiten, die Ajax zur Kommunikation mit dem Server verwenden, funktionieren anders als klassische Seiten. Während bei Ajax viele Anfragen mit vergleichsweise geringem Datenvolumen zwischen Server und Client ausgetauscht werden, sind klassische Seiten monolithische Datenblöcke, die am Stück übertragen werden.

Der Nachteil an der Ajax-Strategie ist, dass Ajax-Anfragen nicht immer vom Browser gecached werden können. Für Ajax-Serverskripte gilt daher das Gleiche, wie für jede andere Seite auch. Nutzen Sie die den Expires-Header, die GZIP-Komprimierung und die anderen in diesem Artikel genannten Regeln, um die Performance Ajax-basierter Anwendungen zu steigern.

Tools

Einige Werkzeuge erleichtern es Ihnen, diese Regeln umzusetzen bzw. zu prüfen, ob eine Webseite diese Regeln auch beherzigt. Am besten kommt man dabei weg, wenn man Firefox als Browser verwendet. Für ihn gibt es die meisten Tools, allen voran Firebug (). Dieses Browser-Plugin erweitert Firefox um einen Javascript-Debugger und -Logger.

Für die Zwecke der Performance-Optimierung viel interessanter als die Funktionen zur Fehlerbehebung, ist die Möglichkeit, den Netzwerkverkehr zu überwachen.

Firebug zeigt hier, wann welches Seiten-element vom Server angefordert wurde und wie viel Zeit bis zum vollständigen Laden des jeweiligen Elementes vergeht. Anhand dieser grafisch aufbereiteten Informationen lässt sich bereits sehr viel über die Lade-Strategien eines Browsers lernen.

Das zweite Tool ist eine Erweiterung von Firebug. Das von Yahoo zur Verfügung gestellte YSlow (gesprochen why-slow, also: warum langsam) erweitert Firebug um einen Benchmarking-Bereich.

Das Plugin ist unter kostenlos verfügbar und bewertet die Performance einer Webseite in verschiedenen Bereichen nach Schulnoten, und zwar nach amerikanischer Notengebung von A (sehr gut) bis E (mangelhaft). Zudem liefert es hilfreiche Tipps, wie die erkannten Probleme beseitigt werden können.

Für andere Browser existieren ähnliche Tools. Der Webinspector für Safari steht der Kombination Firebug/YSlow kaum nach. Auch die aktuellen Opera-Versionen haben entsprechende Tools standardmäßig mit an Bord. Ein wenig magerer sieht die Situation für den Internet Explorer aus. Hier gibt es weniger Tools, die zumeist auch kostenpflichtig sind.

Fazit

Durch die Einhaltung einiger weniger Regeln kann die Geschwindigkeit einer Webseite deutlich erhöht werden. Je höher die Besucheranzahl einer Seite ist, desto mehr helfen diese, eine Seite schnell an den Besucher auszuliefern und den Server so wenig wie möglich zu belasten.

Viele der genannten Mittel kann man einfach umsetzen, doch andere setzen voraus, dass man sich entsprechender Browser-Plugins bedient. Denken Sie immer daran: Eine Seite kann nie schnell genug geladen sein.

Mehr zum Thema

HTML5: Quick Reference Guide
Ratgeber: "HTML5"

Die wichtigsten Tags auf einen Blick: In unserem praktischen Arbeitsblatt finden Sie einen wertvollen Begleiter für die Umstellung Ihrer Webprojekte…
internet, webdesign, google, content, ranking, seo, suchmaschine
Ratgeber: Urheberrecht

Einzigartige Inhalte bieten Lesern Mehrwert und sind ein wichtiges Qualitätsmerkmal. Ärgerlich, wenn sich jemand durch Kopieren an fremden Ergebnissen…
Die besten HTML5-Tipps
Neue Tipps & Tricks für blitz.io

Wer die Leistung einer Applikation ermitteln möchte, braucht keine Skripte zu schreiben, sondern kann einen der zahlreichen Online-Dienste einspannen.…
image.jpg
Ratgeber: Webentwicklung

Die clientseitige Javascript-Entwicklung bietet fast keine Entwicklungsumgebungen und auch keine vernünftigen Werkzeuge zur Fehlersuche. Eine der…
internet, webdesign, meteor, webapplikationen
Ratgeber

Mit Meteor sollen Entwickler in kurzer Zeit Umgebungen für Webapplikationen erstellen können, ohne sich um lästige Details kümmern zu müssen. Wir…