Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to eliminate render-blocking JavaScript

I was testing the web page loading with Google PageSpeed tool. The result says "Eliminate render-blocking JavaScript and CSS in above-the-fold content" for

<script type='text/javascript' src='http://example.com/wp-includes/js/jquery/jquery.js?ver=1.11.2'></script>
<script type='text/javascript' src='http://example.com/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1'></script>

The source code is:

<head>
...
...

<script>(function(){document.documentElement.className='js'})();</script>
...
...
</head>

I'm keen to add a async or defer tag. How can I achieve this?

like image 735
user5090396 Avatar asked Jul 24 '15 16:07

user5090396


1 Answers

From MDN about the async attribute:

It has no effect on inline scripts (i.e., scripts that don't have the src attribute).

The same is true about the defer attribute.

Basically, if you really want to get rid of the error, just move that to just before the </body> tag.

like image 64
Jeff Shaver Avatar answered Oct 08 '22 15:10

Jeff Shaver