Schlanke, schnelle Websites: So beschleunigen Sie den Aufbau von Webseiten

Mit einem langsamen Webseiten-Aufbau verärgern Sie Ihre Besucher

Von: Ralph Steyer
Stand: 31. August 2007
3.666665
(3)
Anmelden um Kommentare zu schreiben

Downloads zu diesem Beitrag

Über den Autor: Ralph Steyer

bild118051

Ralph Steyer ist Diplom-Mathematiker und seit 1996 selbstständig im Bereich Schulung, Programmierung und Beratung. Seine Spezialgebiete sind die Internet-Programmierung und objektorientierte Software-Entwicklung. An der Hochschule RheinMain hat er einen Lehrauftrag im Fachbereich Multimediadesign. Ralph Steyer schreibt außerdem regelmäßig für verschiedene Computermagazine und ist Autor zahlreicher Fachbücher zu Themen von JavaScript, Web-Frameworks wie jQuery über Java bis zum Intranet-Management. Auf der Autorenseite von Amazon finden Sie zu den Büchern genauere Informationen. Sein Blog und seine Homepage sind auch gute Quellen für weitere Informationen.

Beiträge des Autors als Atom-Feed Atom-Feed: Neues von akademie.de

Andere Möglichkeiten

Verwenden naher Server oder eines verteilten Netzwerkes aus Servern

Die geografische Entfernung zwischen Client und Server spielt rein physikalisch eine große Rolle bei der Performance einer Webseite. Es hat offensichtlich Performancevorteile, wenn die Daten zum Besucher nicht all zu weite Strecken im Internet zurücklegen müssen. Wenn Sie überwiegend Besucher aus Deutschland erwarten, dürfte beispielsweise ein Webserver in Deutschland oder dem nahen europäischen Ausland bzgl. der Performance besser sein als ein Webserver in den USA.

Wenn Sie allerdings internationale Besucher erwarten, müssten Sie im Grunde verschiedene Lokalitäten mit Daten vorhalten. Dennoch dürfte es nur für größere Angebote von Interesse sein, Inhalte über verschiedene, geografisch verteilte Server anzubieten. Dann müssen Sie aber auf einer Einstiegsseite die Lokalität des Besuchers über die Auswertung bestimmen und ihn dann auf ein Angebot auf einem möglichst nahen Server weiterleiten. Das kann man beispielsweise auf Grund der IP-Nummer des Absenders oder (meist einfacher) entsprechender HTTP-Header machen.

Bild vergrößern

Mit einem ausgefeilten System kann man darüber hinaus auch intern die Datenbereitstellung optimieren.

Setzen eines Ablaufdatums

Über einen so genannten Expires-Header kann man ein Ablaufdatum für Komponenten festlegen. Im Umkehrschluss bedeutet das auch, dass die Dateien mit so einer Angabe vor dem Erreichen des Ablaufdatums vom Browser gecached werden können. In der Regel werden Expires-Header in Verbindung mit Bildern verwendet, aber sie lassen sich auch mit anderen Komponeten wie Skripts, Style Sheets oder Flash-Animationen verwenden.

Das Ablaufdatum einer Komponente

Komprimierte Inhalte übermitteln

Fast alle modernen Browser kommen mit komprimierten Inhalten im Gzip-Format zurecht. Das können Sie leicht nachprüfen, indem Sie mit einem Sniffer die HTTP-Header analysieren. Sie finden dort im Request meist einen Eintrag Accept-Encoding: gzip, deflate.

In einem Sniffer erkennen Sie den HTTP-Header

Wenn einem Webserver diese Angabe übermittelt wird, kann ein Client mit so komprimierten Inhalten umgehen. Dann kann der Webserver über ein Header-Feld 'Content-Encoding' kennzeichnen, dass er eine Antwort komprimiert verschickt (Content-Encoding: gzip) und Daten entsprechend komprimieren.

Diese Seite ist für Mitglieder von akademie.de reserviert.

Möchten Sie die Mitgliedschaft 14 Tage kostenlos testen und den Beitrag komplett lesen?

Ich bin bereits Mitglied
Jetzt Probemitglied werden
Ich kann in den 14 Tagen Probezeit formlos z.B. per E-Mail stornieren. Wenn ich das nicht tue, entscheide ich mich für ein

Kommentar-Darstellungsoptionen

Wählen Sie hier Ihre bevorzugte Anzeigeart für Kommentare aus und klicken Sie auf „Einstellungen speichern“ um die Änderungen zu übernehmen.

Dieser "Artikel" sollte überarbeitet werden. Momentan ist es nur eine Aufzählung von Ursachen. Wie man dann etwas behebt, wird im Großteil der Punkte nicht aufgeführt.

Ergänzend möchte ich noch ein paar Tipps zu Bildern geben:
- Wird keine Animation benötigt, verwendet man statt GIF besser PNG, das in fast allen Fällen besser komprimiert (Ausnahme sind da eigentlich nur ganz kleine Bilder um 100 Bytes).
- Die Kompression von PNG-Bildern lässt sich mit Programmen wie pngout optimieren. pngslim umfasst gleich mehrere derartige Programme für bestmögliche Kompression. Diskussion dazu hier:
- BMP hat im Web nichts verloren.
- Für Fotos nimmt man am ehesten JPEG, für manche Computergrafiken (etwa Knöpfe, Symbole) und auch Comics bietet PNG evtl. die bessere Kompression, insbesondere bei wenigen Farben, obwohl es verlustfrei ist (solange man mit der Qualität des JPEG-Bildes nicht zu stark runtergeht).

Außerdem: Stilanweisungsdateien für verschiedene Zielmedien (etwa screen, print) werden üblicherweise alle sofort geladen und nicht erst bei Bedarf. Daher lassen sich dort auch noch HTTP-Anfragen einsparen, wenn man diese Dateien nicht mit dem (X)HTML-Attribut media="…" referenziert, sondern nur eine einzige Datei einbindet, die die entsprechenden Stilangaben in @media-Blöcken enthält. Auch lassen sich so Stilangaben, die mehrere Medien betreffen (etwa @media screen, projection, handheld) meiner Meinung nach einfacher zusammenfassen.

Heinz