Boehrsi.de V7 - Minimierung von HTTP Requests
Wie im ersten Teil angekündigt werde ich nun, wenn auch mit einer doch recht langen Verzögerung, Stück für Stück über meine neue Seite berichten. Und da ich gerne von oben nach unten arbeiten möchte, beginne ich heute mit den HTTP Requests. Denn diese liegen meiner Meinung nach ganz oben. Bei meiner Reihenfolge kann es vorkommen das ihr anderer Meinung seid als ich aber ich denke das sollte verschmerzbar sein. Doch was sind eigentlich HTTP Requests? Kurz gesagt sind es die Anfragen die ihr an den Server stellt, sofern ihr Daten laden wollt. Ruft ihr also meine Seite auf, stellt ihr eine Anfrage an meinen Server euch die gewünschten Daten zu liefern. Eine Seite enthält eine Vielzahl von Elementen, wie z.B. Text, Bilder und Multimedia Inhalte. Die wollen geladen werden und das möglichst schnell und effektiv, wie ich dies auf meiner Seite versucht habe zu optimieren könnt ihr bei Interesse nun im unteren Teil der News lesen.
Umso häufiger Client und Server sich austauschen müssen umso langsamer wird alles, denn neben den Nutzdaten gibt es einfach auch einige Steuerdaten die übertragen werden müssen. Also ist es erstrebenswert möglich wenige dieser Kommunikationen durchzuführen. Um dies zu erreichen habe ich versucht die folgende Dinge umzusetzen:
- Minimalismus - Möglichst wenige Bilder und komplexe Elemente im Design selbst einbinden. Das dies natürlich vom jeweiligen Projekt abhängig ist ist mir klar, doch in meinem Fall war dies zum Glück umsetzbar.
- CSS Sprites - Möglichst viele der genutzten Bilder in einem Bild zusammen fassen und die direkte Anzeige via CSS lösen. Über dieses Thema berichtete ich bereits.
- Dateien zusammenfassen - Ich habe fast alle meine nötigen externen Dateien, wie z.B. Javascript Dateien oder ähnliches in jeweils einer Datei zusammengefasst.
- Caching - Eine extrem wichtige Funktion, denn sie ermöglicht den erneuten Transport von bereits vorhandenen Daten komplett zu unterbinden und diese lokal vom Client selbst zu laden. Dies kann allerdings bei Änderungen an der Seite oder falschen Einstellungen zu Problemen führen und muss dementsprechend gut konfiguriert sein. Zu diesem Thema wird es noch einen weiteren Beitrag geben.
- Content Delivery Netzwerk (CDN) - Ein CDN open_in_new stellt Daten die häufig genutzt werden über eine zentrale Anlaufstelle zur Verfügung. Kombiniert man dies mit Caching erhält man die Möglichkeit z.B. eine Library wie jQuery gar nicht mehr bei einem Besuch einer neuen Homepage laden zu müssen. Denn die Library wurde bereits durch einen Besuch auf einer anderen Homepage übertragen und kann somit lokal geladen werden. Sollte doch etwas heruntergeladen werden müssen stammen die Daten von global schnell erreichbaren Servern, da ich mich für Google als CDN Betreiber entschieden habe.