JavaScript above the fold

Was heißt

Eliminate render-blocking JavaScript and CSS in above-the-fold content

Bedeutet übersetzt: Eliminiere JavaScript und CSS im above-the-fold-content, die das Rendering blockieren.

Im PageSpeed Insights heißt diese Aufforderung mittlerweile: Ressourcen beseitigen, die das Rendering blockieren

Bevor der Webbrowser Deinem Besucher eine Webseite anzeigen kann, muss er das HTML rendern. Stößt der Browser während des Rendering-Prozesses auf eine JavaScript- oder Stylesheet-Datei, stoppt der Browser das Rendering, lädt die Datei herunter und fährt erst fort, wenn er sie ausgeführt hat. Solche Dateien verzögern also das Rendering Deiner Webseite und somit den ganzen Prozess, bevor Dein Besucher die Webseite angezeigt bekommt.

Muss der Browser viele Dateien laden, verzögert sich der Seitenaufbau enorm, was sowohl für Besucher als auch Suchmaschinen von Nachteil ist. Du solltest daher unkritische Dateien an eine spätere Position verschieben, sodass der Browser das Rendern der Seite abgeschlossen hat und erst danach beginnt die Dateien herunterzuladen und auszuführen.

Das ist jedoch gar nicht so einfach: Du musst nicht nur Anpassungen an Deiner HTML-Seite vornehmen können, sondern auch wissen welche Dateien zu welchem Zeitpunkt während des Renderings benötigt werden. Knifflig!

Am einfachsten ist es ein Plugin zu nutzen, dass Dich dabei unterstützt.

WP-Rocket lässt sich sehr einfach und leicht bedienen und kann Dich beim Punkt Eliminate render-blocking JavaScript and CSS in above-the-fold content unterstützen.

Wenn Du selbst Webentwickler bist und vollen Zugriff auf Deine Seite hast, kannst Du die Optimierung händisch vermutlich noch verbessern. Dazu solltest Du kritisches CSS inline in den Header Deiner Webseite auslagern. Alles weitere CSS kann dann im Footer geladen werden.

1 Antwort

Trackbacks & Pingbacks

  1. […] JavaScript später parsen (eliminate javascript above the fold) […]

Dein Kommentar

An Diskussion beteiligen?
Hinterlasse uns Deinen Kommentar!

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.