2017-02-17 5 views
3

Ich habe ein Skript aus einem CDN direkt vor dem schließenden Tag der Seite meiner Seite (über </body>) platziert. Google Pagespeed Insights sagt:PageSpeed ​​beschuldigt Skript von "render-blocking" bei Verwendung von externen Bild

beseitigen Render-Blockierung JavaScript und CSS in Above-the-fold Inhalt
Ihre Seite hat 1 Blockierungsskript Ressourcen. Dies führt zu einer Verzögerung beim Rendern Ihrer Seite.

Ich dachte, Skripte vor dem Ende meiner </body>nicht Verzögerung der Rendering?

Nach einigen Versuchen und Fehler habe ich herausgefunden, dass dies verursacht wird, weil meine Seite ein externes Bild verwendet. Mit dem folgenden Beispiel Sie können Page Speed ​​verursachen eine „Render-blocking“ Skript zu erkennen:

<body> 
    <img src="http://i.stack.imgur.com/oURrw.png" /> 
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> 
</body> 

Ist dies wirklich zu einer Verzögerung führen beim Rendern meine Seite?

+0

Können Sie eine [mcve] zusammenstellen, die das * "Ihre Seite hat 3 blockierende Skript Ressourcen ..." * Fehler und setzen Sie das Markup in der Frage? –

Antwort

0

IMHO Ihr Glaube ist richtig, Googles PageSpeed ​​sollte sich auf die Ressourcen beziehen, die einige Seitenrenderingzeiten blockieren b/c es führt die Skripte synchron aus, also lädt Ihre Seite theoretisch noch async und deshalb tut es das nicht Wenn Sie die Änderungen ändern, werden sie im Defer-Modus geladen. Sie können diesen netten Beitrag überprüfen, der es wirklich gut erklärt here.

+0

Ok. Aber es scheint, dass das Hinzufügen von 'Defer' nur PageSpeed ​​Insights erfüllt, was im Vergleich zu Scripts vor'' eigentlich nichts Gutes bewirkt. –

1

Ich dachte, Skripte vor dem Ende meiner </body> verzögern das Rendern nicht?

Richtig, sie nicht.

Zum Beispiel für mich, diese (mit Bild) lösen das Render-blocking Warnung für https://code.jquery.com/jquery-3.1.1.min.js:

...

Wenn ich die img entfernen, das Render-Blocking-JavaScript Warnung verschwindet.

Ich würde dies als einen Fehler melden. Ich sehe nichts, was das Skript blockiert. Ich habe sogar versucht, die img in einer festen Größe, overflow: nonediv zu wickeln, und immer noch den Fehler. Ich verstehe nicht, warum dieses Skript das Rendern blockieren würde. Wenn Sie es als Fehler melden, und es stellt sich heraus, dass es einen Grund gibt, nun, das ist ein gutes Ergebnis. Aber wahrscheinlicher ist es ein Fehler.

+0

Wissen Sie, wo ich diesen Fehler melden kann? –

+0

@RuudLenders: Nicht ohne Grund, nein, aber Google ist ziemlich gut darin, die Dinge ziemlich offen zu halten. (Mit gelegentlichen Stolpern, natürlich.) –

Verwandte Themen