Wordpress Performance Wordpress SEO Wordpress Security Wordpress Themes Wordpress Hosting Mein Setup Das Buch

WordPress auf Speed Teil 1: Allgemeine Performance-Tipps

Wordpress Speed Performance Diagramm

Weitere Artikel dieser Serie

WordPress Performance-Optimierung

WordPress ist meine erste Wahl für eigene Web-Projekte, denn das CMS ist schnell, zuverlässig, SEO-freundlich, vor allem gibt es aber auch für nahezu jeden Bedarf bereits ein passendes Plugin oder Snippet. Doch gerade diese Offenheit ist es auch, die des Öfteren mal für ernsthafte Probleme sorgt. So ist nicht jede Erweiterung für WordPress auch wirklich nützlich. Viele von ihnen müllen die Datenbank einfach nur zu, andere verursachen Fehler, manch eines sogar Sicherheitslücken. Alles nicht wirklich schön, doch alles auch gar nicht notwendig. Wer WordPress sauber hält und nur mit bedacht erweitert, der hat meist nämlich auch keine großartigen Probleme. Betroffen sind eher die Neulinge, die ohne Sinn und Verstand Themes, Plugins und Snippets hinzufügen, ohne genau zu wissen was die Codeschnipsel eigentlich genau aktivieren. Einmal im Jahr sollte das System und die Datenbank außerdem gründlich gereinigt werden, dann bleibt auch die Performance von WordPress auf einem durchgehend hohen Niveau.

Performance ist in diesem Blog auch gleich ein gutes Stichwort, denn alles was ich euch im Bereich WordPress vorstelle, wird auch stets getestet, optimiert, analysiert und auf Leistungsbremsen untersucht. Möglichst minimalistisch und möglichst schnell sollt es sein, denn auch Google legt großen Wert auf die Ladezeiten von Websites. Allerdings nicht nur Google, sondern auch echte Besucher, denn kaum jemand wartet im Web länger als einige Sekunden. Außerdem haben viele Smartphones keinen unbegrenzten Datentarif, demnach gilt es sparsam mit dem Internetanschluss seiner Nutzer umzugehen. Im Idealfall ist eine Website in Millisekunden geladen, denn nur dann erfreut sie Besucher, nur dann steigen die Seitenaufrufe ins unermessliche, nur dann gibt es hohe Conversion Rates und Umsätze. Performance ist alles im Internet und genau deshalb gibt es nun auch diese Artikelreihe. WordPress auf Speed. Ganz ohne Kompromisse und für jeden, auch für Anfänger, verständlich und möglichst einfach präsentiert.

In mehreren Teilen möchte ich euch hier Tipps und Tricks für eine bessere WordPress Performance geben. Am Ende der Artikelserie sollte euer Blog oder eure Website rasend schnell sein, denn WordPress erlaubt eine ganze Menge Optimierungen, die für einen enormen Schub in Sachen Performance sorgen können. Dann wird das Tuning auch für euch eine echte Sucht, denn für mich ist es mehr als nur ein Hobby, das letzte bisschen Speed aus WordPress herauszukitzeln. Doch genug geredet, fangen wir einfach mit den Optimierungen an. Alles beginnt erst einmal damit, dass eigene Theme auf Performance-Bremsen zu untersuchen und dabei grundlegende Dinge Einstellungen und Eigenheiten zu beachten. Also Ärmel hochkrempeln und ran an die Arbeit, es ist noch viel zu tun.

Das eigene WordPress Themes prüfen

Am Anfang aller Optimierungen stellt sich immer die Frage, ob das eigene WordPress Theme überhaupt so klug gewählt worden ist. Wofür eine aufwändige Startseite, wo doch auch kleine Blogs unglaublich erfolgreich sein können. Wozu die vielen Bilder gleich auf Seite 1, wenn diese doch so unfassbar viel Ladezeit kosten. Oder warum muss es unbedingt der aufwändige Slider sein, wo Slider doch nachweislich schlecht funktionieren. Alles was auf der Startseite angezeigt wird, benötigt Ladezeit. Doch auf der Startseite wollen Nutzer nicht lange warten, sie wollen sofort eine Übersicht der Inhalte oder der letzten Artikel sehen. Also durchsucht erst einmal euer Theme selbst und entfernt alles, was ihr nicht unbedingt benötigt.

Damit meine ich jetzt nicht nur Dinge, wie einen Slider oder aufwändige Bilder, sondern eben auch Kommentare im Code des Themes. Die braucht ihr nicht, also weg damit. Formatiert alles korrekt, löscht den eventuell vorhandenen Freiraum und schaut zu, dass jede einzelne Datei des Themes (index.php, category.php etc.) so klein wie nur möglich wird. Desto weniger Zeilen, umso schneller ist das WordPress Theme später geladen und desto weniger Code muss abgearbeitet werden. Also weg mit dem Ballast. Lasst nur das Nötigste übrig.

Auch solltet ihr über das WordPress Theme selbst nachdenken. Ist es wirklich so klug gewählt? Viele Anfänger entscheiden sich zu Beginn für eindrucksvolle und schlichtweg “überdesignte” Themes, die verspielte Animationen und/oder Features enthalten. Doch mit der Zeit merken viele dann, dass ein optimiertes, minimalistisches Themes viel mehr Sinn ergibt. Der Wechsel fällt dann allerdings immer schwerer, vor allem wenn exklusive Features oder Shortcodes genutzt wurden. Doch lieber jetzt noch einmal in den sauren Apfel beißen und wechseln, als in 10 Jahren, wenn ihr erfolgreich seid, und ihr den ganzen Mist aufgrund der vielen Integrationen nicht mehr loswerdet. Also schaut euch euer Theme unbedingt noch mal genauer an.

Der Standard-Loop reicht aus

Als nächstes empfiehlt sich ein Blick in das eigene Theme bzw. auf den Loop des Themes zu werfen. Das fängt ebenfalls wieder bei der index.php an und geht weiter zur category.php und den anderen Dateien. Denn hier sollte, wenn ihr nicht gerade eine aufwändige Startseite besitzt, nichts weiter als der Standard-Loop vorhanden sein, ohne starke Abweichungen, die allerlei Parameter abfragen. Keine Spielereien, keine umständlichen Aufrufe, belasst es einfach bei dem Standard-Loop. Glaubt mir, der reicht vollkommen aus und ist in Hinblick auf nahezu alle anderen Loops auch der schnellste. So sieht die simpelste Form aus:

<code><?php if (have_posts()) : while (have_posts()) : the_post(); ?></code>

Style.css bereinigen

In der style.css befinden sich meist eine ganze Menge überflüssiger Parameter. Diese lassen sich recht einfach bereinigen, denn dafür gibt es das wunderbare Tool CSS-Usage, welches ein Addon für Firebug ist. Um Firebug effektiv zu nutzen, ist der Firefox Browser notwendig und dort sucht ihr dann nach CSS-Usage. Das Tool nistet sich direkt in Firebug ein und erkennt alle CSS-Werte der aktuellen Seite. Wer dort nun auf “Scan” klickt und dann mehrere Seiten und Unterseiten seiner Website aufruft, bekommt die entsprechende Anzeige präsentiert. Was rot ist kann theoretisch weg, allerdings solltet ihr die Einträge einzeln noch einmal auf ihre Gültigkeit hin überprüfen und nur das löschen, was auch wirklich nicht mehr benötigt wird. Am Ende sollte in der style.css nur das verbleiben, was auch wirklich innerhalb des Blogs genutzt wird. Eine Alternative zu Firebug und CSS-Usage wäre noch Dust-Me Selectors. Mit letzterem hatte ich aber immer mal wieder einige Probleme und rate daher zu CSS-Usage. Eine minimale CSS ist jedenfalls der perfekte Start für die Optimierung des eigenen Blogs.

Style.css auf Performance optimieren

Doch mit der style.css ist noch eine ganze Menge mehr möglich. Vor allem solltet ihr sie komprimieren, was ganz einfach über ein entsprechendes Online-Tool geht. Dafür gibt es verschiedene Websites, auf denen ihr dann einfach nur noch euren kompletten Inhalt der style.css kopiert und diese entsprechend verkleinert. Diese Komprimierung wird oft unterschätzt, führt in der Praxis aber wirklich zu deutlich schnelleren Ladezeiten. Ein wichtiges Detail also, auch weil dieser Vorgang dann bereits abgeschlossen ist und nicht von entsprechenden WordPress Plugin übernommen werden muss. Um die eigene style.css zu komprimieren, könnt ihr den Service von CSS Minify nutzen, der im Vergleich zu manch einem anderen Tool, sehr einfach zu bedienen ist und entsprechend sauber arbeitet.

Inline CSS statt CSS-Datei

Es gibt Fälle, in denen ist Inline CSS schneller als eine CSS-Datei. Das klingt komisch, weil Web Designer eigentlich immer das Gegenteil gelernt haben, doch es ist wirklich so. Einer dieser Fälle ist auch dieser Blog hier, in dem der gesamte CSS-Code innerhalb des Header platziert wurde. Statt also eine extra CSS-Datei zu laden, nutze ich hier Inline CSS und habe damit eine entsprechend hohe Punktzahl bei Google Pagespeed. Ob Inline CSS auch für euch Sinn ergibt und die Performance verbessert, oder ob ihr getrost darauf verzichten könnt, kommt immer auf den Einzelfall an. Theoretisch bleibt eine CSS-Datei im Cache performanter, wobei Inline CSS von Google Pagespeed honoriert wird. Einfach mal durchlesen, denn das Thema erfordert ein paar Überlegungen. Meine Empfehlung: Wenig CSS kann direkt in den Header verlagert werden. Bei extrem viel CSS-Code, ist eine CSS-Datei allerdings stets effektiver, egal ob es dafür ein paar Punkte Abzug in irgendwelchen Tools gibt. Schlussendlich kommt es auf die tatsächlich Leistung an, nicht auf 100 Punkte bei Pagespeed.

Weg mit dem Javascript

Als ein wirklich großes Problem sehe ich immer wieder den unsinnigen Einsatz von Javascript. Diese Scripte sind dann meist noch im Head eingebunden, oft aber auch einfach nur komplett sinnlos. Überlegt euch also ganz genau, ob ihr die Scripte in eurem Blog wirklich benötigt. Ist der Slider sinnvoll und wird er überhaupt von Besuchern geklickt? Macht eine Lightbox auf eurem Blog wirklich Sinn, nur um die Bilder hübscher darzustellen? Reicht nicht auch ein einfacher Link zum vergrößerten Bild? Berechtigte Fragen, denn gerade bei einer Lightbox kann der Blog ganz schön lahmgelegt werden. Die Scripte sind zum Teil abnorm groß, vor allem aber auf den meisten Websites völlig überflüssig, zumindest wenn ihr nicht gerade ein Portfolio oder einen Foto-Blog betreibt. Überlegt euch solche Sachen deshalb immer ganz genau und schmeißt alles raus, was nicht zu 100% benötigt wird. Der Rest kommt in den Footer, denn Scripte sollten nie am Anfang bzw. hoher Priorität geladen werden. Die Faustregel bleibt: Je weniger Scripte, desto schneller die Website. Gerade Anfänger neigen dazu viel Javascript einzusetzen, weil es meist hübsche Effekte und Animationen ermöglicht. Also immer hinterfragen, ob das jeweilige Script nur Spielerei ist, oder dem Besucher wirklich einen echten Mehrwert bringt. Meistens ist Javascript überflüssig und überdimensioniert und für eine kleine Funktion gleich ein ganzes Framework wie jQuery einbinden, macht auch keinen Sinn.

Scripte vom Gratis-CDN laden

Wenn ihr dennoch Scripte bzw. Frameworks wie jQuery ladet, dann setzt gleich auf ein schnelles Content Delivery Network. Doch ein CDN  kann und will sich nicht jeder leisten. Allzu viele deutsche Anbieter gibt es außerdem gar nicht und wenn ein CDN seine Server in Amerika stehen hat, dann ist der Nutzen gleich wieder eher fragwürdig. Doch Scripte brauchen gar kein eigenes CDN, denn Google und Co bieten solche Standards über öffentliche CDN-Server an. Wenn euer Blog also jQuery und andere Bibliotheken nutzt, dann schaut mal hier vorbei und prüft, ob diese nicht direkt vom Google, Cloudflare, Microsoft oder WordPress CDN geladen werden können. Das wäre dann nämlich schneller und einfacher, würde euren eigenen Webspace oder Server deutlich entlasten und damit eventuell auch gleich die Ladezeit eurer Website spürbar verbessern.

Neben Google gibt es wie erwähnt auch noch die Möglichkeit Scripte über das WordPress CDN zu laden. Auch Microsoft bietet ein eigenes und öffentlich zugängliches CDN an, genau wie auch Cloudflare. Das Besondere am CDN von Cloudflare ist, dass es neben den großen und sehr bekannten Javascripts, wie beispielsweise jQuery, auch unbekannte und kleine Scripte hostet. Wer also all seine Scripte via CDN laden möchte, der sollte sich CDNJS von Cloudflare unbedingt mal genauer anschauen. In meinem Artikel habe ich alle kostenlosen Möglichkeiten für euch aufgelistet.

Überflüssige Plugins löschen

Eine Lightbox bindet in WordPress kaum noch ein User per Hand ein, denn der Aufwand ist den meisten einfach zu groß. Andere kennen sich damit nicht aus, müssen also auf ein Plugin zurückgreifen. Von Hand einbinden, empfinde ich persönlich aber immer als die bessere Methode, weil ein Plugin überflüssige Aufrufe und eventuell Umwege generiert. Darum gilt auch hier, genau wie beim Javascript, alles löschen was im Blog nicht unbedingt benötigt wird. Wer von 20 Plugins, 10 überflüssige bzw. nur selten genutzte abschaltet, der erlebt einen deutlichen Schub in Sachen Performance. Mehr als zehn Plugins sollten es aber eh nicht sein und nur ganz selten sind wirklich mehr als zehn Erweiterungen überhaupt notwendig. Meistens werden viele Features einfach nur mitgeschleppt, weil sie beim Aktivieren damals irgendwie “cool” geklungen haben. Dabei entpuppen sich die meisten WordPress Plugin aber sehr schnell als überflüssig, sollten also deaktiviert und gelöscht werden. Wer außerdem ständig neue Plugins testet, müllt damit seine Datenbank zu und trifft irgendwann bestimmt auch auf eines, welches unverhältnismäßig viel Leistung frisst. Dann legt ein einziges Plugin unter Umständen plötzlich den ganzen Blog lahm.

Am Ende solltet ihr einfach sehr sparsam mit WordPress Plugins umgehen. Braucht ihr wirklich ein Related Post Plugin, muss es wirklich ein exklusiver Mediaplayer oder eine Lightbox sein? Gerade hier sollte niemand vergessen, dass Videos auch via HTML 5 und mit dem Player von WordPress selbst eingebunden werden können. Doch lange Rede, kurzer Sinn: Oft klingen die Beschreibungen von Plugins zwar super, mit der Zeit stellt sich dann aber ein eher geringer Mehrwert heraus. Die eigene Regel für WordPress Plugins sollte also lauten: Jedes Plugin immer mehrmals hinterfragen und über seinen Sinn und seine Existenzberechtigung im eigenen Blog nachdenken. Und wenn ihr sie wirklich alle benötigt, lässt sich das ein oder andere Plugin nicht deaktivieren, indem ihr die Funktion mit ein wenig Aufwand per Hand einbindet, oder ein kleines Snippet in die functions.php integriert? Beides wäre nämlich die deutlich performantere Alternative.

Wer nun nicht so richtig weiß welches Plugin er entfernen soll, der darf direkt einen Blick in diesen Artikel werfen. Dort zeige ich euch, wie ihr mithilfe einer Erweiterung (welch Ironie) den Einfluss eurer Plugins auf die Ladezeit testet. Welches Plugin belastet eure Website am meisten? Das herauszufinden macht Sinn, denn so können die wahren Speed-Killer direkt deaktiviert und entfernt werden. Das Löschen ist übrigens recht wichtig, denn manche Erweiterungen verbrauchen auch dann noch Ressourcen, wenn sie bereits deaktiviert wurden. Davon abgesehen gibt es einige Plugins, die als wahre Performance-Monster bekannt sind.

Artikel auf der Startseite

Ebenfalls sehr wichtig für die Performance, ist die Anzahl der Artikel auf der Startseite. Jeder Beitrag führt zu einer geringfügigen Verzögerung, jeder angezeigte Artikel macht eure Website also ein Stück langsamer. Nach mehreren Jahren und vielen Blogs würde ich nun sagen, dass fünf bis sieben Artikel vollkommen ausreichen und sich als ideal in Bezug auf Ladezeit erwiesen haben. Sicherlich gibt es aufwändige Magazine wo deutlich mehr gewünscht ist, doch auch da solltet ihr es nicht übertreiben. Zu jedem Artikel kommt nämlich auch noch ein Thumbnail, Angaben zur Kategorie, ein Datum, sowie weitere Details, die alle aus der Datenbank abgefragt werden müssen. Solche Dinge benötigen viel Zeit und fressen Leistung, zumal die Datenbank oft als Flaschenhals anzusehen ist. Je weniger Artikel also angezeigt werden, desto schneller wird die Startseite geladen und desto glücklicher sind die Leser.

Doch es gibt in diesem Bezug noch einen weiteren Vorteil. Stammleser müssen früher oder später auf Seite 2 blättern. Das führt zu einer höheren Anzahl an Seitenaufrufen und darauf achtet selbst Google inzwischen. Nur wenn Websites auch wirklich “durchklickt” werden, werden diese auch als “wertvoll” angesehen. Mehr Seitenaufrufe sind also positiv, auch gerade dann wenn ihr eure Website irgendwann einmal vermarkten wollt. Also lieber wenige Artikel auf der Startseite anzeigen, die dafür aber angemessen präsentiert werden. Macht Sinn, oder etwa nicht?

WordPress auf Englisch

Der vorläufig letzte Tipp für eine bessere Performance bzw. für Teil 1 der Artikelserie WordPress auf Speed, betrifft die Sprache von WordPress. Auch wenn sich hier in der Vergangenheit und mit immer neuen Updates sicherlich bereits eine Menge getan hat, so ist WordPress auf Englisch immer noch dezent schneller als auf Deutsch. Vor allem im Admin ist das festzustellen, aber auch auf der Frontpage hat die gewählte Sprache durchaus einen Einfluss, je nachdem welche Elemente dort genutzt werden. Soll heißen: Stellt WordPress unbedingt auf Englisch. Es lohnt sich! Das geht inzwischen sogar ganz einfach in den Einstellungen. Anschließend könnt ihr via FTP im Ordner “wp-content/languages” noch alle überflüssigen Sprachdateien entfernen.

Die Sache mit der Sprache hat noch einen weiteren Vorteil. Irgendwann einmal kommt nämlich der Punkt, da wollt ihr eine Funktion programmiert haben, sucht Hilfe bei einem professionellen Entwickler oder ähnliches. Da die meisten Profis in Sachen WordPress aber nicht aus Deutschland, sondern aus Amerika und England stammen, macht ein englisches WordPress Backend Sinn, weil ihr so gleich die richtigen Bezeichnungen der Menüpunkte seht und sie nicht erst selbständig übersetzten müsst. Freelancer und internationale Mitarbeiter lassen sich deshalb deutlich einfacher instruieren. Mal abgesehen von den Foren, wo auch oft die englischen Bezeichnungen verwendet werden.

Ein paar Worte zum Schluss

Das war es nun mit Teil 1 der Serie WordPress auf Speed. In den weiteren Teilen der Artikelserie werde ich mich auf bestimmte Aspekte von WordPress konzentrieren. Zum Beispiel auf die Datenbank, auf Plugins welche die Performance anheben, oder auf geheime Tricks und Snippets für die functions.php. Genug Potenzial ist jedenfalls vorhanden und bei all meinen Tipps schwingt auch persönliche Erfahrung mit. Ich rede nicht davon, wie es sein müsste oder sollte, sondern davon wie ich die verschiedenen Dinge selbst kennengelernt und gelöst habe. Ich hoffe es war und ist weiterhin interessant für euch.



Wordpress Performance eBook