nachhaltiges webdesign jetzt
info

Caching-Techniken nutzen

Beim Caching werden bestimmte Daten unserer Websites temporär gespeichert. Sie müssen also nicht bei jedem Besuch neu generiert und übertragen werden. Das verringert die Serverlast und die Menge der übertragenen Daten, macht Websites schneller und umweltfreundlicher.

negativen Fußabdruck minimieren
positiven Fußabdruck maximieren
sowohl als auch

Caching verstehen

Ein Cache ist ein Speicher, der ausschließlich für temporäre (zeitlich begrenzte) Daten zuständig ist. Er ermöglicht, dass diese Daten schneller geladen werden, als von ihrem ursprünglichen Speicherort.

Das Grundkonzept existiert seit Jahrzehnten und ist nicht auf das Web beschränkt. Es wird hauptsächlich genutzt, um häufig angeforderte Daten nicht bei jedem Aufruf neu zu generieren, sondern eben schon vorgeneriert schnell ausliefern zu können.

Caching spart Zeit und Rechenleistung und eignet sich damit ausgezeichnet, um den negativen Fußabdruck unserer Websites zu minimieren.

Mit weniger übertragenen Daten und weniger Serveranfragen werden unsere Seiten zusätzlich deutlich schneller geladen. Das bedeutet: bessere Nutzer*innen-Erfahrung und besseres Ranking in Suchmaschinen.

Selten wird die komplette Website im Cache gespeichert. Gerade bei Seiten mit viel dynamischem, sich oft veränderndem Inhalt, wie bei News-Seiten oder Onlineshops, wäre das äußerst kontraproduktiv. Neuigkeiten werden nämlich nicht automatisch in die Cache-Version übernommen. Oft werden deshalb nur einzelne Komponenten, wie CSS- und JS-Dateien oder Bilder im Cache untergebracht.

Server-side Caching nutzen

Verfügen unsere Seiten über Datenbanken (üblich bei Content Management Systemen wie WordPress), werden sie bei jeden Aufruf neu aus der Datenbank generiert. Dieser Vorgang erfordert viel Rechenleistung der Server.

Alternativ können wir eine fertig generierte Version auf dem Server Cache bereitstellen, die an Besucher*innen übertragen wird, ohne dass die Datenbank involviert ist.

Dieses Vorgehen funktioniert am besten bei statischen Inhalten. Aber auch bei dynamischen Seiten können Teile der Website durchaus gut im Server-Cache untergebracht sein.

Welche Technik hierbei genutzt wird, ist davon abhängig, mit welchen Werkzeugen wir Websites erstellen. Für WordPress existieren PlugIns, für andere Seiten bieten sich Frameworks wie Gatsby oder Varnish an.

Ein Problem bei Server-side Caching ist, dass die Endgeräte weiterhin auf die Dateien vom Server warten müssen und auch jedes Mal übertragen werden.

Client-side Caching nutzen

Im Optimalfall liegen die Daten bereits auf dem Endgerät unserer Seitenbesucher*innen. In diesem Fall muss nichts übertragen werden, sondern die Seite wird einfach aus dem Cache des Endgeräts bereitgestellt.

Meist wird mit Client-Side Caching das (zeitlich begrenzte) Speichern von Daten der Website im Browser-Cache bezeichnet. Alle modernen Browser arbeiten standardmäßig mit einem Cache, wenn Nutzer*innen diese Funktionalität nicht deaktivieren.

Bei einem zweiten Besuch der Website werden dann lediglich Änderungen zu der gecachten Version abgefragt und eventuell dynamischer Inhalt nachgeladen.

Auch bei dieser Technik existieren verschiedene Herangehensweisen: Browser-Caching für Dateien wird bei Apache-Servern über Einträge von mod_expires oder mod_headers in die .htaccess Datei unserer Websites aktiviert.

Dynamische Inhalte können über Javascript/AJAX Caching aktualisiert werden, ohne statische Inhalte neu laden zu müssen.

Darüber hinaus existieren komplexe Methoden wie Service-Worker bzw. Progressive-Web-Apps, mit denen noch größeres Finetuning möglich ist und Offline-Versionen von Websites erstellt werden können. An dieser Stelle gehen wir auf diese Techniken (noch) nicht ein.

Ressourcen

Habt ihr weitere außergewöhnliche Ressourcen (umfassend, tiefgreifend, klug, lustig) zu diesem Thema?
Vermisst ihr etwas? Oder hat euch der Inhalt sehr geholfen?

Dieses Projekt lebt von eurer Beteiligung. Schreibt mir gern eine Zeile an mail@gerritschuster.de