Performance Archive

Scripts Aktions-abhängig laden, z.B. wenn ein Button geklickt wird

Johannes 2. August 2020

Für WordPress und natürlich andere CMS gibt es tausende Plugins und viele davon laden eigene Scripts und Styles bei euch im Frontend. Die Anzahl und vor allem die Größe kann eure Website-Performance massiv beeinträchtigen. Wie man Plugins dazu bringt, Scripts & Styles nur zu laden, wenn sie wirklich notwendig sind, habe ich euch bereits gezeigt.

Es gibt aber Elemente z.B. Share-Buttons oder Autosuggest-Suchen die sind auf jeder Seite vertreten, werden aber nur bei einem Bruchteil der Seitenaufrufe wirklich von Nutzer genutzt. Nur, wenn der User den Beitrag teilen möchte oder eine Suche eintippt.

Ziel ist es an dieser Stelle das benötigte Script erst zu laden, wenn man sich sehr sicher ist, dass der Nutzer die Aktion ausführen will. Im Idealfall muss der User vorher auf einen Button klicken aber auch wenn der User mit der Maus über dem Suchfeld oder Button schwebt, kann als Auslöser herangezogen werden.

WordPress Performance Hack: Cache direkt vom Webserver ausliefern lassen

Johannes 14. Februar 2020

Bei einem Seitenaufruf von einer WordPress-Seite wird von Haus aus bei jedem Aufruf PHP ausgeführt, die Datenbank abgefragt und schlussendlich die Antwort als HTML an den Nutzer gesendet. Egal, ob sich etwas an der Seite seit dem letzten Seitenaufruf geändert hat oder nicht.

Wenn die eigene Website nur eine Handvoll Aufrufe pro Tag hat, ist das kein Problem. Hat man aber plötzlich sehr viele Aufrufe in einer kurzen Zeit, ist der Server schnell überfordert und wird sehr schnell 503 Service Unavailable Antworten senden.

WordPress: Scripts & Styles von Plugins nur laden wenn wirklich notwendig

Johannes 21. Januar 2020

Nicht jeder Programmierer denkt bei der Entwicklung eines Plugin (aber auch Themes) daran, ressourcenschonend mit den eingebunden Scripts & Styles umzugehen. Statt die Assets nur bei Seitenaufrufen zu laden, wo sie auch wirklich verwendet werden, werden häufig alle Datein bei jedem Seitenaufruf geladen. Das ist nicht nur schlecht für die Performance beim Leser sondern kostet auch einfach Resourcen.

Ein gutes Beispiel ist das beliebte Contact Form 7 Plugin (es gibt bessere Kontakformular-Plugins, ich bin z.B. ein Fan von HTML Forms, aber darum soll es hier nicht gehen). Installiert und aktiviert lädt es bei jedem Seitenaufruf 1,61 KB Stylesheet und 14,10 KB (+94,60 KB jQuery als Abhängigkeit) Javascript. Ein Kontaktformular haben die meisten Websites aber nur unter /kontakt/ eingebunden. Es ist also zu 99% unnötig, dafür Bandbreite und Rechenzeit zu verschwenden.

Viel geschickter wäre es, Style & Scripts nur zu laden, wenn bei einem Seitenaufruf auch der Shortcode für ein Formular [contact-form-7] eingebunden ist.