Kompressions- und Cache-Audit
Zwei Antwort-Header entscheiden, wie viele Bytes beim ersten Besuch übertragen werden und wie viele beim nächsten noch einmal komplett. Dieses Audit liest sie auf Ihrer Seite und auf bis zu vierzehn ihrer eigenen Dateien.
Ein kurzer Austausch in den Headern
Mit jeder Anfrage nennt ein Browser die Kompressionsformate, die er entpacken kann:
Accept-Encoding: gzip, deflate, br, zstd
Ein Server mit aktivierter Kompression wählt eines aus, verkleinert die Datei und kennzeichnet die Antwort mit Content-Encoding: br (Brotli) oder gzip. HTML, CSS und JavaScript sind sich wiederholender Text und verlieren typischerweise 70 bis 85 % ihrer Größe. JPEG-, PNG-, WebP-, AVIF- und WOFF2-Dateien sind durch ihr eigenes Format schon komprimiert, sie unverändert zu senden ist also richtig.
Caching ist die andere Hälfte. Cache-Control: max-age=31536000 erlaubt dem Browser, eine Datei ein Jahr lang ohne Nachfrage wiederzuverwenden. Ist die Lebensdauer abgelaufen, kann der Browser dank eines ETag- oder Last-Modified-Headers eine günstige Frage stellen, „Hat sich das geändert?“, und der Server antwortet mit 304 Not Modified ohne Inhalt.
Welche Dateien geprüft werden
Wir beginnen mit der Seite selbst, nach Weiterleitungen, und nehmen dann Dateien derselben registrierten Domain, die in ihrem HTML stehen: bis zu vier Stylesheets, fünf Skripte, drei Bilder und zwei Schriften. Ungenutzte Plätze gehen an die übrigen Dateien, insgesamt fünfzehn, und in Ihren Stylesheets referenzierte Schriften kommen hinzu, wenn Platz ist. Jede Datei wird so angefragt, wie es ein Browser tun würde, mit Angebot von Brotli und gzip, über HTTP/2, wenn der Server es unterstützt.
Dateien auf anderen Domains, etwa Google Fonts oder ein Analyse-Skript, bleiben außen vor. Deren Header können Sie nicht setzen.
Wie jede Spalte bewertet wird
- Kompression
- Grün, wenn eine Textdatei mit einem
Content-Encodingankommt. Rot, wenn die Seite oder eine Textdatei über 20 KB unkomprimiert ankommt. Orange für kleinere unkomprimierte Dateien, und Dateien unter 1 KB rechnen wir nichts an. Für jede unkomprimierte Datei komprimiert das Audit den Inhalt selbst mit gzip und zeigt die Größe, die Sie bekämen. Bei Bildern und WOFF2-Schriften steht „nicht nötig“. - Cache
- Die Lebensdauer stammt aus
max-ageoder, ohnemax-age, ausExpires. Ein Stylesheet, Skript, Bild oder eine Schrift wird markiert, wenn keine Lebensdauer gesetzt ist oder eine unter sieben Tagen.no-storeundno-cachezählen als null. Die HTML-Seite wird nur zur Information gezeigt, mit einem Hinweis, wenn sie länger als eine Stunde aufbewahrt werden darf, denn wiederkehrende Besucher könnten dann eine veraltete Fassung sehen. - Protokoll
- Bestanden mit HTTP/2, das alle Dateien parallel über eine Verbindung überträgt. HTTP/3 wird über den
alt-svc-Header erkannt, in dem ein Serverh3ankündigt. - Ersparnis
- Übertragene Bytes gegenüber entpackten Bytes für die ganze Stichprobe.
Eine Website, die überall gzip nutzt, bekommt einen Hinweis auf Brotli, das Textdateien um etwa 15 bis 20 % kleiner macht. Sehen Sie das als Verbesserung, die man einplanen kann. Ohne Brotli ist nichts falsch.
Sicher einrichten
Wenn etwas zu beheben ist, enthält das Ergebnis fertige Blöcke für Apache und nginx. Hinter einem CDN wie Cloudflare geschieht die Kompression am Edge, und Cache-Lebensdauern sind eine Einstellung im Dashboard. Bei WordPress schreiben Caching-Plugins dieselben Regeln für Sie.
Für die Lebensdauer entscheidet eine Regel alles. Ein langer Cache ist nur sicher, wenn sich die Adresse der Datei ändert, sobald sich ihr Inhalt ändert. Build-Tools erzeugen Namen wie app.3f9a1c.js, und WordPress hängt ?ver=6.8 an. Solche Dateien vertragen:
Cache-Control: public, max-age=31536000, immutable
Dateien mit festem Namen sind mit einer Woche bis einem Monat besser bedient. Für HTML behält Cache-Control: no-cache eine Kopie und prüft sie vor jeder Verwendung beim Server.
Trotz seines Namens bedeutet no-cache „vor der Verwendung neu prüfen“. Die Anweisung, die das Aufbewahren einer Kopie verbietet, ist no-store, und sie gehört auf Seiten mit personenbezogenen Daten.
Um eine Änderung im Terminal zu bestätigen:
curl -sI -H "Accept-Encoding: br, gzip" https://example.com/ | grep -iE "content-encoding|cache-control"
Was das Audit auslässt
Es ist eine Stichprobe von fünfzehn Dateien einer einzigen Seite, ein Problem, das nur eine andere Vorlage betrifft, kann also durchrutschen. Zstandard bietet es nicht an. Es liest max-age und ignoriert s-maxage, das nur geteilte Caches betrifft. Und es überspringt Dateien, die Ihr eigenes CDN von einer anderen Domain ausliefert. Jede Datei wird bis zu 3 MB heruntergeladen.
Häufige Fragen
Wie prüfe ich, ob gzip oder Brotli auf meiner Website aktiv ist?
Fragen Sie eine Seite mit einem Accept-Encoding-Header an und suchen Sie in der Antwort nach Content-Encoding. Dieses Audit tut das für die Seite und ihre wichtigsten Dateien, der curl-Befehl oben für eine einzelne Adresse.
Ist Brotli besser als gzip?
Für Text ja. Dateien werden etwa 15 bis 20 % kleiner, und jeder aktuelle Browser akzeptiert es über HTTPS. Gzip bleibt eine gute Basis und der Rückfall für ältere Clients. Server schalten meist beides ein.
Welches Cache-Control sollte ich für CSS und JavaScript verwenden?
Ändern sich Dateiname oder Query-String mit jedem Release: public, max-age=31536000, immutable. Ändert sich der Name nie, wählen Sie eine kürzere Lebensdauer wie eine Woche, sonst hängen Besucher nach einem Update an der alten Fassung fest.
Sollte man Bilder mit gzip komprimieren?
Nein. JPEG, PNG, WebP und AVIF sind bereits komprimiert, und gzip würde Rechenzeit verbrennen, um fast nichts zu sparen. SVG ist die Ausnahme, denn es ist Text und lässt sich sehr gut komprimieren.
Warum fehlen manche meiner Dateien in der Tabelle?
Wir prüfen nur Dateien derselben registrierten Domain wie die Seite, höchstens fünfzehn. Dateien von einer anderen Domain und Dateien, die Skripte später nachladen, sind nicht in der Stichprobe.
Brauche ich HTTP/3?
HTTP/2 ist der Schritt, der zählt, und fast jeder Hoster bietet es an. HTTP/3 hilft vor allem bei instabilen Mobilverbindungen, und am einfachsten bekommen Sie es über ein CDN, das es standardmäßig aktiviert.