Wenn es um die Webleistung geht, ist einer der entscheidenden Faktoren die Beseitigung von Rendering-Blocking-Ressourcen. Rendering-Blocking-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 die Anzeige der Seite durch den Browser verzögern könnte.
Einige Rendering-Blocking-Ressourcen sind zwar notwendig, wie z. B. CSS-Dateien, die dafür sorgen, dass Ihre Seite korrekt aussieht, aber andere können optimiert oder eliminiert werden. Um die Ladegeschwindigkeit Ihrer Website zu maximieren, ist es wichtig, Rendering-blockierende Ressourcen zu identifizieren und zu minimieren oder zu eliminieren, wo dies möglich ist. Vielleicht ist Ihnen diese Empfehlung schon aufgefallen, als Sie Ihre WordPress-Website mit dem PageSpeed-Tool getestet haben.
Wie identifiziert man eine Rendering-blockierende Ressource?
Wenn Sie versuchen, die Leistung Ihrer Website zu verbessern, stoßen Sie vielleicht auf den Begriff "Rendering-Blocking-Ressourcen". Damit sind alle Ressourcen gemeint, die geladen werden müssen, bevor der Browser mit dem Rendern der Seite beginnen kann. Dazu gehören in der Regel externe CSS- und JavaScript-Dateien.
Sie können die Google Chrome Developer Tools verwenden , um eine Rendering-blockierende Ressource zu identifizieren. 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 nun Ihre Website neu. Die Entwicklertools zeigen Ihnen eine Liste aller Ressourcen, die beim Rendern Ihrer Seite geladen werden. Suchen Sie nach Ressourcen, die eine rote Linie neben sich haben. Dies sind die Ressourcen, die das Rendern blockieren.
3 Wege, um eine Rendering-blockierende Ressource in WordPress zu beseitigen?
Es gibt verschiedene Möglichkeiten, dies in WordPress zu tun.
Methode 1:
Eine davon ist das Inline-CSS, d. h. der CSS-Code wird direkt in die HTML-Datei eingebettet, anstatt ein externes Stylesheet aufzurufen. Dies kann für kleine Websites mit nur wenigen Seiten effektiv sein, ist aber für größere Websites nicht praktikabel. Sobald Sie die Rendering-blockierenden Ressourcen identifiziert haben, müssen Sie diese entfernen oder einbinden. Inlining bedeutet, dass die Ressource direkt in den Code eingebettet wird, so dass sie nicht separat geladen werden muss. Dies kann mit JavaScript- und CSS-Dateien geschehen. 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. Dazu können asynchrone Ladetechniken verwendet werden, z. B. das Laden von JavaScript-Dateien, nachdem das Dokument geparst wurde, oder die Verwendung von Aufschubattributen.
Methode 3:
Schließlich können Sie auch versuchen, die Anzahl der auf jeder Seite benötigten Ressourcen zu reduzieren. Dies kann bedeuten, mehrere CSS- oder JavaScript-Dateien in einer Datei zusammenzufassen oder kleinere Bilder zu 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 Nutzererlebnis bieten. Wenn Sie mehr Zeit brauchen, um sich mit dem Code vertraut zu machen, können einige Plugins wie Autoptimize, WPRocket usw. dabei helfen, diesen Prozess zu automatisieren.
In einigen Fällen können Rendering-Blocking-Ressourcen für das ordnungsgemäße Funktionieren Ihrer Website erforderlich sein. In diesen Fällen müssen Sie einen Weg finden, sie zu optimieren, damit sie schneller geladen werden.
Einpacken
Wenn Sie die obigen Ratschläge befolgt haben, sollten Sie nun die meisten, wenn nicht sogar alle, Rendering-blockierenden Ressourcen auf Ihrer Website beseitigt haben. Wenn Sie dennoch Hilfe benötigen, sollten Sie unseren professionellen WordPress-Geschwindigkeitsoptimierungsservice in Anspruch nehmen. 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 auch andere Faktoren die Leistung Ihrer Website beeinflussen können, z. B. die Reaktionszeit des Servers, die Dateigrößen und die Codequalität. Die Beseitigung von Ressourcen, die das Rendern blockieren, ist jedoch ein hervorragender Ansatz, um die Geschwindigkeit und Leistung Ihrer Website und die Core Web Vitals-Noten zu verbessern.
