Schneller, höher, weiter

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

Auf der Client-Seite muss nichts beachtet werden. Die Webbrowser erkennen anhand eines HTTP-Headers automatisch, dass der Inhalt komprimiert übertragen wurde und verarbeiten diesen entsprechend.

Während Textdaten wie HTML, CSS und Javascript dankbare Ziele für eine Kompression mittels GZIP sind, macht diese bei Binärdaten, die auf einer Webseite vorkommen, in der Regel keinen Sinn. Bilder liegen beispielsweise bereits in komprimierter Form vor.Eine GZIP-Komprimierung bewirkt hier dann das Gegenteil: Die Dateien werden geringfügig größer. Aus diesem Grund sollte man immer in der Serverkonfiguration die Komprimierung auf Textinhalte beschränken.Die Komprimierung von Bildern sollte immer mit Augenmaß durchgeführt werden. Viele moderne Bildbearbeitungsprogramme unterstützen das Speichern von Grafiken für das Web. Meist kann hier gezielt auf das Format und die Qualität Einfluss genommen werden.

Performance-Optimierung

© Archiv

Das von Yahoo kostenlos zur Verfügung gestellte YSlow-Plugin für das Benchmarking einer Seite gibt Verbesserungsvorschläge.

Diese Arbeit sollte man nicht automatisieren, da dies in der Regel immer eine Gratwanderung zwischen Dateigröße und Bildqualität ist und ein Mensch dies besser beurteilen kann als eine Maschine. Beachten Sie dabei auch, dass sich die verschiedenen Formate nur für unterschiedliche Bildtypen eignen.

Während bei Fotos die besten Ergebnisse mit JPEG erzielt werden (sowohl in Bezug auf Qualität als auch Dateigröße), werden gezeichnete Bilder normalerweise mit den Formaten PNG oder GIF gespeichert.

Verschleierungstaktik

Javascript und CSS machen heute einen großen Teil einer Webseite aus. Daher lohnt es sich hier, zusätzlich zur bereits beschriebenen serverseitigen Komprimierung mit GZIP, noch weitere Optimierungen einzusetzen.

Wie in jeder anderen Programmiersprache versuchen Webentwickler auch in Javascript sauber formatierten und gut dokumentierten Quellcode zu schreiben, der auch nach einigen Monaten noch vernünftig gewartet werden kann. Variablen werden sprechend benannt, Klammern gesetzt, Zeilen eingerückt und mit Kommentaren wird nicht gegeizt.

Performance-Optimierung

© Archiv

YSlow zeigt statistische Auswertungen über eine Seite und die Nutzung des Caches.

Was für einen Entwickler wichtig ist, interessiert einen Browser überhaupt nicht. Für ihn sind diese Mittel überflüssig. Auch in Hinblick auf die Reduzierung der zu übertragenden Datenmenge macht sich ein Entfernen aller überflüssigen Zeichen positiv bemerkbar. Zwei Lösungsansätze können dabei unterschieden werden.

Die einfachste Lösung besteht darin, alle syntaktisch nicht notwendigen Zeichen zu entfernen. Hierdurch lassen sich alle Kommentare, viele Leerzeichen und Zeilenumbrüche einsparen. Das folgende Listing zeigt eine einfache Javascript-Funktion mit Formatierung und Kommentaren.

// Wunderbare Testfunktion
function hallo() {
var ausgabetext = ,Hallo Welt';
alert (ausgabetext);
}

Mehr zum Thema

Youtube Sperre umgehen GEMA
Videos freischalten

So umgehen Sie die GEMA-Sperre bei Youtube. Was Sie dazu brauchen, und wie es am einfachsten geht.
Neue Fritzboxen unterstützen den AC-Standard.
WLAN-Geschwindigkeit verdoppeln

Mehr WLAN-Geschwindigkeit: Mit dem WLAN-Standard 802.11ac und den richtigen Geräten und Einstellungen verdoppeln Sie den Datendurchsatz.
Netflix auf dem TV
Programm in der Übersicht

Welche Filme und Serien gibt es bei Netflix eigentlich zu sehen? Was ist neu im Streaming-Angebot? Diese Antworten helfen weiter.
Netflix
Streaming

Preise, kompatible Geräte, Datenrate, Serien- und Filmangebot von Netflix: Wir beantworten die wichtigsten Fragen rund um den Streaming-Dienst.
E.T. – Der Außerirdische
Vorschau auf Film- und Serien-Highlights

Amazon Prime Instant Video lockt im Dezember 2016 mit Film-Highlights wie "E.T.", "Fast & Furious 7" und der Serie "Ku’damm 56​".