Hmm.. also der Blog schaut aus wie vorher!?

Stimmt, naja, fast wie vorher.  Die wichtigsten Änderungen fanden auch unter der Haube statt. Wie bei einem zufälligen Performancetest herauskam, war mein Blog rein rechnerisch gesehen nämlich eine ziemlich lahme Ente. Da half auch nicht, dass die gefühlte Geschwindkeit weit höher lag als die ermittelten Werte. Wenn Google in den Webmastertools mit Ladezeitenangaben von bis zu 15 Sekunden herumnörgelt, dann sollte  das einem schon zu denken geben. Da  also etwas getan werden musste und mir solche Bastelaufgaben liegen, wurde kurzerhand “Projekt:Bloggonaut.net optimieren” ins Leben gerufen, welches mir die letzten Tage einiges an Nerven gekostet, aber auch viel Spass bereitet hat.

Toll, aber was hat sich denn nun geändert?

Momentchen. Als erstes möchte ich euch den obligatorischen Vorher – Nachher Vergleich präsentieren:

Vorher

Bloggonaut Performance

Nachher

Bloggonaut nach der Optimierung

Page load time (Ladezeit der Webseite): von durchschnittlich 8-9Sek. auf ca. 3Sek. > 63% Optimiert!

Total page size (Größe der Webseite): von 550kb auf 218kb > 60% Optimiert!

Requests (Anfragen an den Webserver): Rückgang von 80 auf 36 > 55% Optimiert!

Der Aufwand hat sich also wirklich gelohnt. Die Werte, wenn auch nicht perfekt, sind sehr zufriendestellend und auch die gefühlte Ladezeit hat sich deutlich verbessert. Einzig die externen Dienste wie Facebook, Buttons, Werbeanzeigen und diverser Google-Code lassen die Werte nicht über die 90% Marke steigen. Da ich auf einige Gimmicks nicht verzichten möchte, ist mir das aber egal. Mit den Werten kann man ganz gut leben :-)

Die Optimierungsmaßnahmen

1. Themencode ausmisten
Als erstes habe ich mein Theme komplett entschlackt. Viele Themes sind mit Adminoptionen und überflüssigen Code ausgestattet, welcher die Theme Dateien nur unnötig aufbläht. Man braucht den Google Analytics Code nicht über Dashboard Optionen eines Themes einfügen, der kommt einfach direkt in die Footer.php Datei. Unnötige Javascriptspielerein wurden komplett entsorgt und wenn man nicht darauf verzichten kann, sollten Sie zumindest in den Footer.

Als nächstes wurden 3 CSS Datein zu einer verschmolzen (vorher mit dem csscruncher Tool optimieren!) und einige Imagedateien zu 2 Sprites zusammengefasst. Hier hilft das  Onlinetool SpriteMe.

2.Überflüssige Widgets und Plugins entfernen
Ein Plugin für Google Analytics ist ebenso überflüssig wie die Dashboard Option eines Themes. Zur Spambekämpfung läuft nur noch das ressourcenschonende und trotzdem effiziente Antispam Bee. Akismet + Matheaufgabe sind Vergangenheit. In der Sidebar habe ich einige Buttons und externen Code entfernt, da die Dienste öfters für längere Ladezeiten sorgten, wenn die Webseiten der Betreiber nicht erreichbar waren. Viele Plugins und Widgets lassen sich außerdem mit WordPress internen Themen-Tags ersetzen.

3. Leverage browser caching, expire headers und ETags
Fragt mich nicht wozu das alles gut ist. Auf jeden Fall habe ich jetzt einiges an Code in die .htaccess Datei gepackt, damit Teile der Webseite auf die eigene Festplatte zwischengespeichert werden und nicht jedesmal alles aus dem Netz geladen werden muss. Mehr Infos und den passenden Code findet man zum Beispiel hier.

4. Datenbank aufräumen
Die Vorgehensweise habe ich ausführlich im vorherigen Blogartikel beschrieben.

5. Cache Plugin
Ein Cache-Plugin setze ich nicht ein, halte es  auch nur für nötig, wenn man auf performancebremsende Dienste nicht verzichten kann, oder ein sehr hohes Besucheraufkommen hat. Wer sich trotz aller Optimierungsmaßnahmen immernoch mit einem langsamen Seitenaufbau herumschlägt, sollte vielleicht mal über einen Wechsel des Hosters nachdenken ;-) Tipp: all-inkl.com – habe seit Jahren keine Probleme und auch größere Besucheranstürme lassen den Server kalt.

Das war es eigentlich auch schon. Der Aufwand mit dem überarbeiten des Themes ist nicht zu unterschätzen und für HTML Anfänger keine leichte Aufgabe, alles andere ist für Blogger mit Performanceproblemen eigentlich relativ einfach umzusetzten.


 


Ähnliche Beiträge: