Checkliste: Performance #

Diese Seite ist für Designer, die die Geschwindigkeit eines Designs prüfen. Messen Sie abgemeldet, auf der Startseite, einem Artikel und einer Liste, einmal direkt nach dem Leeren der Caches und noch einmal.

Inhalt #

1. Im Browser
2. Auf dem Server
3. Zahlen, die Sie festhalten

Im Browser #

• To do: Eine Stylesheet-Anfrage vom Design (gepackt) (Der Packer).
• To do: Höchstens zwei Skript-Anfragen; nicht kritische Skripte verzögert (JavaScript laden).
• To do: Kein Skript im Kopf, das das Rendern blockiert, außer einem winzigen Schutz vor dem ersten Zeichnen.
• To do: Schriften selbst gehostet, font-display: swap, wenige Schnitte (Schriften in einem Design).
• To do: Bilder in Aliassen nahe der angezeigten Größe, srcset, wo Größen variieren (Bild-Performance).
• To do: Bilder unterhalb des ersten Bildschirms lazy; das Hauptbild nicht lazy.
• To do: Breite und Höhe an Bildern und Einbettungen; CLS höchstens 0,05 (CLS und LCP messen).
• To do: Keine Anfrage an Drittanbieter vor der Einwilligung (Externe Ressourcen und CDNs).
• To do: Seitenspezifisches CSS und JS nur von den Templates angefordert, die es brauchen.

Auf dem Server #

• To do: Vollansichten liegen im View-Cache; nichts Benutzerspezifisches darin (Caching für Designer).
• To do: Menüs und Fußbereiche in Cache-Blöcken mit korrekten, kleinen Schlüsseln.
• To do: Jedes Listen-fetch hat ein limit; kein fetch innerhalb eines foreach (Performance von fetch).
• To do: Der aktuelle Knoten wird einmal im Pagelayout geholt und von den Teilen wiederverwendet.
• To do: Die Debug-Ausgabe (auf einem Test-Siteaccess) zeigt eine vernünftige Zahl von Datenbankabfragen für die Seite.

Zahlen, die Sie festhalten #

Halten Sie sie beim Start fest; vergleichen Sie nach jeder Veröffentlichung des Designs.

Verwandte Seiten #

• Performance von Themes
• Checkliste: Start eines Themes
• Freie Dokumentation: Diese Seite darf unter der GNU FDL 1.3 frei kopiert, übersetzt und verbessert werden.