Hajosiewer.de läuft seit gut vier Jahren mit WordPress. Damals 2008 stand ein Redesign und ein Relaunch an, den ich machen durfte.

Dieser Tage wurde ich kontaktet, weil ein Plugin WP Postratings einfach nicht funktionierte und die örtliche Werbeagentur feststellte, dass sie dies nicht lösen können. Was war passiert… .

WP hausinterne Hooks unbrauchbar machen und die Folgen

In vier Jahren ändert sich manches an einer Website. Features kamen auch bei Hajosiewer dazu. Die Anzahl der JavaScripts stieg ins unermessliche, unterschiedliche Libraries waren auch vorhanden und irgendwann vertrugen die sich nicht mehr.

2008 war es noch sehr wichtig, dass die linke Navigation auch für den IE 6 funktioniert. Daher wurde dies hochkomplex aufgebaut und tat lange Jahre ihren guten Dienst. Irgendwann entschied man sich, es wäre doch einfacher, wenn neue Seiten automatisch in der Navigation auftauchten und es wurde eine .js Lösung gefunden.

Damit diese aber funktinierte wurden die WP Hooks wp_head und wp_footer unbrauchbar gemacht. JSScripte “hart” im html Header verlinkt – das kostete Performance und dies nicht zu knapp

1.Schritt => Lösung des Plugin Problems

1.

Die linke Navigation wird mit WP hauseigenen Mittel nun geliefert – sie ist ein benutzerdefiniertes Menü.

Seiten können derzeit nicht automatisch hinzugefügt werden, doch das Menü zu befüllen ist in WordPress sehr, sehr einfach und geht rasch.

Weggefallen sind nun etliche JavaScripts und vorallem konnte ich die Hooks wp_head und wp_footer wieder aktivieren.

Erster Erfolg
Nun funktionierte WP Postratings einwandfrei. Aber die Website war immer noch langsam.

ausmisten und Performance steigern konnte beginnen

Vorneweg: Der Browser bekommt die Anweisung eine Seite zu öffnen. Nun guggt er was ihm da geliefert wird

Hat man einen Mischmisch zwischen CSS und ScriptDateien, zeigt der Browser die Seite erst an, wenn er alle Scripte abgearbeitet hat => dies macht eine Seite langsam einfach.

1.
Das verwendete Lighbox Plugin brauchte mehrere JavaScripte im Header, es wurde ausgetauscht gegen ein modernes,leichtes Lightbox Plugin => ich entschied mich schlussendlich für Shutter Reloaded, weil es wenig Scripte braucht, weil es einfach nutzbar ist und weil ich damit auch sehr gute Erfahrung bei einem responsiv Design machen konnte. Und wer weiß, ob Hajosiewer.de nicht mal auch responsiv wird

2.
Das Plugin “send to a friend” wurde ersatzlos gestrichen, weil es sowieso kaum genutzt wurde. => wieder fielen etliche JS Scripte weg.

3.
Die Buchungsseite bietet einen Kalender, dessen Datapicker.js wird jetzt per conditional comments nur mehr auf genau dieser Unterseite ausgeliefert. Keine andere Seite oder Artikel braucht diese Scripte, also wozu sitewide liefern. Und außerdem verlink ich diese Scripte im html Footer und nicht mehr im html Header.

4.
Die CSS Dateien diverser Plugins wurden soweit leicht möglich in die style.css vom Theme gepackt und somit wurden acht http Header Aufrufe eingespart.

5.
Via functions.php schicke ich zwar alle Scripte in den html Footer, aber das Newsletterplugin nutzt diesen Hook nicht und daher holt es jQuery immer noch in den HTML Header => doch alle anderen Scripte halten sich an diese Anweisungen und wandern wie durch Zauberhand in den HTML Footer.

6.

Das Plugin Cachify installiert und es macht die Seite einfach schneller – mehr gibt es da nicht zu sagen

es freut einfach …

Diesen Artikel zu tippen brauchte mehr Zeit für mich als die Arbeiten an der Seite einfach, weil ich WordPress gut kenne und daher weiß was es braucht, damit es verdammt schnell sein kann.

In diesem großen Screenshot von pagespeed.de zeige ich mal das Ergebnis von 95/100 und auch wenn sicher noch einiges drin wäre an Performanche => ich freu mich über diesen raschen Erfolg.

Die Links aus dem Artikel

Shutter Reloaded, Cachify , das Tool Pagespeed.de und natürlich www. Hajosiewer.de .