Wenn es um die Webleistung geht, ist die Eliminierung von Rendering-blockierenden Ressourcen einer der entscheidenden Faktoren. Renderblockierende Ressourcen verzögern das Rendern einer Seite und können Dinge wie JavaScript- und CSS-Dateien umfassen. Diese Ressourcen müssen geladen werden, bevor der Browser mit dem Rendern der Seite beginnen kann. Dazu gehören externe CSS- und JavaScript-Dateien und alles andere, was den Browser beim Anzeigen der Seite zunächst verzögern könnte.
Während einige Rendering-blockierende Ressourcen erforderlich sind, wie z. B. CSS- Dateien, die dafür sorgen, dass Ihre Seite korrekt aussieht, können andere optimiert oder eliminiert werden. Um die Ladegeschwindigkeit Ihrer Website zu maximieren, ist es wichtig, Rendering-blockierende Ressourcen zu identifizieren und nach Möglichkeit zu minimieren oder zu eliminieren. Diese Empfehlung ist Ihnen vielleicht beim Testen der WordPress-Site mit dem PageSpeed-Tool .
Wie erkennt man eine Rendering-blockierende Ressource?
Wenn Sie versuchen, die Leistung Ihrer Website zu verbessern, stoßen Sie möglicherweise auf den Begriff „Ressourcen, die das Rendern blockieren“. Dies bezieht sich auf alle Ressourcen, die geladen werden müssen, bevor der Browser mit dem Rendern der Seite beginnen kann. Typischerweise umfasst dies externe CSS- und JavaScript-Dateien.
Google Chrome-Entwicklertools verwenden, . Laden Sie Ihre Website in Chrome und öffnen Sie dann die Entwicklertools. Klicken Sie auf die Registerkarte „Abdeckung“ und stellen Sie sicher, dass die Option „Cache deaktivieren“ aktiviert ist. Dadurch wird sichergestellt, dass Sie die aktuellste Version Ihrer Website sehen.
Laden Sie jetzt Ihre Website neu. Die Entwicklertools zeigen Ihnen eine Liste aller Ressourcen, die beim Rendern Ihrer Seite geladen werden. Suchen Sie nach Ressourcen, neben rote Linie Dies sind die renderblockierenden Ressourcen.
3 Möglichkeiten, eine Rendering-blockierende Ressource in WordPress zu beseitigen?
Es gibt in WordPress verschiedene Möglichkeiten, dies zu tun.
Methode 1:
Eine besteht darin, kritisches CSS zu integrieren , was bedeutet, dass der CSS-Code direkt in die HTML-Datei eingebettet wird, anstatt ein externes Stylesheet aufzurufen. Dies kann für kleine Websites mit nur wenigen Seiten effektiv sein, ist jedoch für größere Websites nicht praktikabel. Sobald Sie die Rendering-blockierenden Ressourcen identifiziert haben, müssen Sie sie entfernen oder einbinden. Inlining bedeutet, dass die Ressource direkt in den Code eingebettet wird, sodass sie nicht separat geladen werden muss. Dies kann mit JavaScript- und CSS-Dateien erfolgen. Plugins wie Flyingpress, WP Rocket, Swift Performance oder LiteSpeed Cache können Ihnen dabei helfen, dies zu automatisieren.
Methode 2:
Eine weitere Möglichkeit besteht darin, nicht kritische Ressourcen nach dem ersten Laden der Seite zu laden. asynchroner Ladetechniken erfolgen , z. B. dem Laden von JavaScript-Dateien nach dem Parsen des Dokuments oder der Verwendung von Defer-Attributen.
Methode 3:
Schließlich können Sie auch versuchen, die Anzahl der auf jeder Seite benötigten Ressourcen zu reduzieren. Dies kann bedeuten, dass Sie mehrere CSS- oder JavaScript-Dateien in einer Datei kombinieren oder kleinere Bilder verwenden, die schneller laden. Indem Sie die Anzahl der Rendering-blockierenden Ressourcen reduzieren, können Sie die Ladegeschwindigkeit Ihrer Website erheblich verbessern und Ihren Besuchern ein besseres Benutzererlebnis bieten. Wenn Sie mehr Zeit benötigen, um sich an die Arbeit mit Code zu gewöhnen, können einige Plugins dabei helfen, diesen Prozess zu automatisieren, z. B. Autoptimize, WPRocket usw.
In manchen Fällen können Rendering-blockierende Ressourcen erforderlich sein, damit Ihre Website ordnungsgemäß funktioniert. In diesen Fällen müssen Sie eine Möglichkeit finden, sie zu optimieren, damit sie schneller geladen werden.
Einpacken
Wenn Sie die oben genannten Ratschläge befolgt haben, sollten Sie nun die meisten, wenn nicht alle, Rendering-blockierenden Ressourcen auf Ihrer Website entfernt haben. Wenn Sie weiterhin Hilfe benötigen, schauen Sie sich unseren professionellen WordPress-Geschwindigkeitsoptimierungsservice . Wir helfen Ihnen, die Leistung und Geschwindigkeit Ihrer Website zu verbessern, was für die Erstellung einer hochwertigen und benutzerfreundlichen Website unerlässlich ist.
Denken Sie daran, dass andere Faktoren die Leistung Ihrer Website beeinflussen können, z. B. die Antwortzeit des Servers, die Dateigröße und die Codequalität. Die Eliminierung von Rendering-blockierenden Ressourcen ist jedoch ein hervorragender Ansatz, um die Geschwindigkeit und Leistung Ihrer Website sowie die Core Web Vitals -Bewertungen zu verbessern.
