Mit der Optimierung des gesamten Bildmaterials in der letzten Woche konnte die Dateigrösse der Seite schon mehr als halbiert werden. Die Website wurde von mehr als 26MB auf 12MB verkleinert. Diese Woche ging es ans Technische.
Der nächste Schritt ist das Minimieren von JavaScript- und CSS-Dateien. JavaScript und CSS sind gängige Skript- und Stylesprachen, die im Webdesign benutzt werden. Es kommt hier und da vor, dass Unnötiges CSS bzw. JavaScript entsteht, was unnötig Ladezeit beansprucht. Fabio und ich minimieren die Dateien gemeinsam. Das klingt schwieriger als es ist, mit der WordPress-Erweiterung „Asset Cleanup“, welche Kostenlos erhältlich ist, geht das ganz schnell und unkompliziert. Nach der Minimierung der CSS-Dateien wird die Seite neu geladen, um zu überprüfen ob diese das überstanden hat. Sehr schnell merke ich jedoch, dass etwas nicht stimmt: Die Schriften und vieles andere sieht nicht mehr so aus, wie es sollte. Wir machen das sofort rückgängig, und die Seite sieht wieder aus, wie sie soll.
Beim Arbeiten mit Asset Cleanup ist Vorsicht geboten. Sehr schnell hat man einen falschen Hebel umgelegt und die Seite funktioniert nicht mehr. Bei unserem Beispiel war der Schaden nicht gravierend, und wir hatten das Problem innert weniger Sekunden behoben. Selbst wenn das Problem gross gewesen wäre, die Homepage von IDEA Küchen und Bad wäre nicht zu Schaden gekommen, da wir nicht auf ihr direkt sondern einer Kopie arbeiten. Das Minimieren von JavaScript funktioniert im Gegensatz problemlos.
Schneller als gedacht
Da dieser Schritt fast keine Zeit in Anspruch nahm, beschliessen wir, gleich noch mit dem nächsten Weiterzufahren: Dem allgemeinen „Aufräumen“ der WordPress-Assets. Was bedeutet das genau? Nun, WordPress und seine Plugins werden auf jeder Seite geladen. Gewisse Plugins und Assets sind jedoch nicht immer nötig. Die Plugins bleiben bei IDEA Küchen unangetastet, denn diese werden tatsächlich alle auf der Seite gebraucht, und ein Plugin fälschlicherweise abzuschalten kann schwerwiegende Folgen haben. Es gibt dennoch einiges, was es auszuschalten gibt. Unter anderem Gutenberg, den Standard-Editor von WordPress. Da diese Seite mit dem Divi Builder erstellt ist, brauchen wir Gutenberg nicht. Ebenfalls können Emojis ausgeschaltet werden, da diese auf der Seite ebenfalls nicht verwendet werden.
Nachdem dies getan ist, machen Fabio und ich erneut eine Messung der Ladezeit. Das Ergebnis kann sich sehen lassen:
Erste Messung bei Projektbeginn
Messung nach der heutigen Arbeit. Die Ladezeit und die Dateigrösse haben sich merklich verringert.
Der nächste Schritt
Nächste Woche werden Fabio und ich einen weiteren wichtigen Schritt in Angriff nehmen: Das Caching. Wir liegen gut in der Zeit und sind überzeugt, dass wir das Projekt noch vor Mitte September abschliessen können.
Fortsetzung folgt am 4.9.2019!