I have placed a script from a CDN just before the closing tag of my page's body (above </body>
). Google's PageSpeed Insights says:
Eliminate render-blocking JavaScript and CSS in above-the-fold content
Your page has 1 blocking script resources. This causes a delay in rendering your page.
I thought scripts before the end of my </body>
don't delay the rendering?
After some trial and error I found out that this is caused because my page uses an external image. With the example below you can cause PageSpeed to detect a "render-blocking" script:
<body>
<img src="https://i.sstatic.net/oURrw.png" />
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
</body>
Does this really cause a delay in rendering my page?
I thought scripts before the end of my
</body>
don't delay the rendering?
Correct, they don't.
For instance, for me, this (with the image) triggers the render-blocking warning for
https://code.jquery.com/jquery-3.1.1.min.js
:...
If I remove the
img
, the render-blocking-JavaScript warning disappears.
I'd report that as a bug. I don't see anything render-blocking about that script. I even tried wrapping the img
in a fixed-size, overflow: none
div
, and still got the error. Can't see why that script would be render-blocking; if you report it as a bug, and it turns out there's a reason, well, that's a good result. But more likely it's a bug.