How to “Eliminate render-blocking JavaScript and CSS in above-the-fold content”

Question

I have a web page which receives a very poor "Mobile" score of 42%. The only item flagged in red is that I should "Eliminate render-blocking JavaScript and CSS in above-the-fold content". But all of the page is rendered above the fold, because it's all on the same page, without scrolling. And all of the JS and CSS is required for rendering the page.

So am I just stuck with a big FAIL from Google, or is there something I've missed?

The main libraries I'm loading are:

jquery.min.js
jquery-ui.min.js
jquery-ui-slider-pips.min.js

... and my own scripts for doing the gruntwork for the page.

What may be causing an issue is that I have an img div with a URL that points to a node server that generates a png on the fly, and it usually takes ~2 secs for that image to be served. But that div is hidden until its ready to display, so I can't see why that would be the real issue.

Thanks for any insights that might help improve the google pagespeed score!

Answer 1

combine and minified the js files and set into last tags on element

<html>
<head></head>
<body>
<!-- html content -->
<script src="minified-script.min.js" type="text/javascript">
</body>
</html>

How to “Eliminate render-blocking JavaScript and CSS in above-the-fold content”

Question

1 answers

solution1
1 2015-07-10 10:26:32

How to “Eliminate render-blocking JavaScript and CSS in above-the-fold content”

Question

1 answers

solution1 1 2015-07-10 10:26:32

solution1
1 2015-07-10 10:26:32