Critical CSS

Critical CSS bezeichnet die minimale Menge an Stilregeln, die zur Darstellung des sichtbaren oberen Seitenbereichs nötig ist, direkt inline geladen wird, damit die Seite sofort gestylt erscheint, während der restliche Stylesheet-Code anschließend ohne Blockierung des ersten Renderns nachlädt.

In der Praxis

Critical CSS ist eine gezielte Technik zur Verbesserung des First Contentful Paint – und, wenn das LCP-Element ein Textblock ist, auch des LCP-Werts. Anlass ist typischerweise ein schwacher FCP in Verbindung mit dem Lighthouse-Hinweis „Renderblockierende Ressourcen beseitigen“. Die Technik bringt zusätzliche Komplexität im Build-Prozess mit sich und ist nicht für jedes Projekt notwendig; sinnvoll ist der Einsatz vor allem bei Seiten mit viel ohne Scrollen sichtbarem Inhalt.

Passende Leistung

Quellen

← Zurück zum Glossar