Google Page Speed Insights
"Versuchen Sie, blockierende Ressourcen zu verschieben oder asynchron zu laden, oder inline die kritische Teile dieser Ressourcen direkt im HTML. "
Das obige Problem fordert mich auf, meine 2 Stylesheets zu verwenden. Also lade ich meine Stylesheets mit dem folgenden Code, um das Laden der Stylesheets zu verzögern.
%Vor% Mit dem obigen Code werden alle CSS-Stylesheets geladen, nachdem die DOMContentLoaded Event und Load Event abgefeuert wurden (Registerkarte "Netzwerk" der Chrome-Entwicklungstools)
Aber selbst mit dem oben Gesagten ist das Renderblocking-Problem immer noch nicht gelöst. Irgendeine Idee, warum es nicht funktionierte und CSS-Stylesheets richtig verzögern? Danke für die Hilfe!
Ich denke, Sie könnten die falsche Richtung eingeschlagen haben. Wenn Sie Ihr CSS laden, nachdem das DOM fertig ist, ist es in der Regel keine empfohlene Übung. Hier ist ein Link zu der HTML-Spezifikation zum Einfügen von CSS Ссылка werden die meisten Browser optimiert, damit CSS im Kopf des Dokuments platziert wird.
Wenn Sie versuchen, die Geschwindigkeit zu optimieren, können Sie Ihre Stile in ein minimiertes Stylesheet verschieben, anstatt zwei asynchrone Abfragen über JavaScript durchzuführen. Wenn Sie möchten, dass die beiden Stylesheets septiert bleiben und sich Sorgen um die Auswirkungen auf die Performance machen, sollten Sie in Erwägung ziehen, CSS inline zu verschieben.
Hier ist ein Link zu einem Artikel, der von Yahoo Best Practices zur Beschleunigung Ihrer Website geschrieben wurde. Ссылка Also ich schätze kurz die Antwort auf deine Frage (allgemeine Faustregel außer Randfälle) wäre deine optimieren Seite, indem Sie ein CSS oben auf Ihrer Seite laden. Selbst wenn Sie es schaffen würden, Ihr CSS schneller zu laden, indem Sie JavaScript verwenden, um es zu laden. Ich denke, du würdest herausfinden, dass du mehr Zeit mit Farb- und Stilberechnungen verbringst (Seitenrendering). Ganz zu schweigen davon, was passiert, wenn jemand JavaScript ausgeschaltet hat
Wenn Sie immer noch nach mehr Leistung suchen, können Sie sich CDN anschauen oder ein eigenes CDN aus einer cookie-losen Subdomain erstellen.
Tags und Links javascript asynchronous pagespeed deferred-loading