Falsch verlinkter CSS-File treibt Ladezeit in die Höhe

Der Beitrag wurde am 27. Januar 2009 von Oliver veröffentlicht

Total verrückt: Seit Wochen suche ich nach der Ursache, warum eine meiner Sites eine Ladezeit von – jetzt haltet euch fest – geschlagenen 12,88 Sekunden (im Durchschnitt!) hat. Man konnte also bequem eine Portion Pasta ordern und sich danach noch eine Flasche Wein genehmigen, während man auf die Site wartete. Ich habe alles überprüft und auch doppelt und dreifach überprüfen lassen. Die Site läuft auf WordPress, wodurch man ja schon mal die eine oder andere Verzögerung durch die teilweise pervers vielen Datenbankabfragen gewohnt ist, aber 12,88 Sekunden? Ich bitte euch! Das kann doch echt nicht wahr sein. Der Server lief auf einem Load von 0.01, befand sich also praktisch im Tiefschlaf. Die Datenbank sah bestens aus und ist schon optimiert. Routing, etc. war auch vollkommen in Ordnung.

Ich wollte es schon aufgeben, da machte ich noch einmal einen Validitäts-Check bei W3.org. Das Tool meckerte über einen falsch verlinkten CSS-File. Dazu muss ich sagen, dass die Site 6 CSS-Files hat, die der Designer angelegt hat (er mag es eben sehr sehr … sehr übersichtlich). Einzeln kontrolliert habe ich die vorab nicht. Ich nahm den Eintrag zu dem gar nicht vorhandenen CSS-File dann mal aus dem Header der Site raus. Resultat? Das gar nicht vorhandene Stylesheet war Schuld. Auf einmal gingen die Ladezeiten auf durchschnittlich 0,3 Sekunden runter. Sowas habe ich noch nie erlebt und es ist nicht das erste Mal, dass ich einen veralteten CSS-Eintrag in einer Site hatte. Ich habe absolut keine Ahnung, warum sich der Browser gerade an diesem so aufgehangen hat.

Abgelegt in Webmaster Work | Tags: none

8 Kommentare »

RSS-Feed für Kommentare zu diesem Beitrag. TrackBack URI

  1. Gravatar of Michael

    Kommentar von Michael vom 27.1.2009

    Erstaunlich, von so etwas habe ich noch nie gehört, ziemlich krass. Da sieht man aber das Validatoren doch sehr nützlich sind und man erkennt oft erst durch solche Dienste bestimmte Fehler. Im Bezug auf WordPress: Das Plugin Super Cache senkt die Zugriffszeiten drastisch auf ein Minimum, auf trafficstarken Seiten hat sich das bei mir sehr gut bewährt.

  2. Gravatar of Paul Janowitz

    Kommentar von Paul Janowitz vom 27.1.2009

    6 CSS Dateien sind leider Unfug. Hierfür werden 6 http requests benötigt, die jeweils einen Overhead verursachen. Noch schlimmer wirkt sich das aus, wenn sie auf verschiedenen (Sub)Domains liegen und jeweils eine DNS-Abfrage nötig ist. Selbst Grafiken lohnt es sich oft zusammenzulegen und pixelgenau zu positionieren, um den Overhead einzusparen. Aber dass sich ein CSS so krass auswirkt, höre ich auch zum ersten Mal. War dies in allen Browsern der Fall?

    JavaScripte sind übrigens wenn möglich ganz am Ende vor dem Schließen des Tags am besten untergebracht um die Ladezeit zu verringern, weil der Browser bei eingebetteten JS Dateien erst diese lädt bevor er den weiteren Inhalt rendert ;-)

  3. Gravatar of Oliver

    Kommentar von Oliver vom 28.1.2009

    @Michael, das habe ich jetzt auch im Einsatz.
    @Paul, die CSS-Dateien sind wohl nach Ajax, XHTML-Grundgerüst, usw. aufgeteilt. Klar, kann man zusammenlegen. Scripte zum Schluss ist klar :)

  4. Gravatar of Paul Janowitz

    Kommentar von Paul Janowitz vom 28.1.2009

    Würde ich zusammenlegen und evtl. durch Kommentare optisch trennen ;-)
    Ansonsten kann ich jedem die Lektüre von “High Performance Websites” von Steve Souders empfehlen. Dort werden ein paar sehr interessante Techniken vorgestellt, wie man seine Seiten im Aufbau optimieren kann, unabhängig vom Backend. Die Tipps sind zudem nach Priorität sortiert und man bekommt schnell gute Ergebnisse und ich war erstaunt, wie viel Potenzial in der Optimierung des Seitenaufbaus steckt.

  5. Gravatar of manuel

    Kommentar von manuel vom 25.2.2009

    Ich empfehle Firebug! Im Netzwerk Tab sieht man sehr genau was wann geladen wird, wie der Request aussieht, wie die Response ist und vor allem wie lange das gedauert hat. — Gruß

  6. Gravatar of Pascal

    Kommentar von Pascal vom 7.3.2009

    Oder man lässt WordPress gar nicht erst auf Apache laufen. :) Lighty mit XCache installieren und dann noch WP-Cache. Schon gibts keine Probleme mehr. Ich bereue den Wechsel auf Lighty nicht und will nicht mehr zum Apachen zurück.

  7. Gravatar of gregor

    Kommentar von gregor vom 10.5.2009

    Danke für den Beitrag. Hab mein Problem jetzt gelöst

  8. Gravatar of Daniel

    Kommentar von Daniel vom 18.5.2009

    Auf jedenfall 1 dickes CSS File machen, das kann man auch sehr, sehr … sehr übersichtlich gestalten! ;) Zu dem WP Super Cache gibts noch zu sagen das auf jedenfall die Option Super Cache aktiviert werden sollte und nicht nur standardmäßig die Caching Option. Dann läufts richtig gut!

Einen Kommentar schreiben

XHTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Powered by WordPress - Valid XHTML and CSS. ^Top^