Eliminate render-blocking javascript - google developers suggestions summary

StackOverflow https://stackoverflow.com/questions/20337626

Question

Google developer tool insist - that I move my modernizr .js to the end of </body> tag, As I understand If I will do so html5 tags will not be supported by ie8 and ie7. (New version of modernizr enables html5 tags support for older browsers)

Is there any solution for that?

Thanks

Was it helpful?

Solution

2017 Note: This original answer is correct in relation to Modernizr, html5shiv and HTML 5 elements in IE 9 and under. Do you even need IE9 in your project? IE9 and under accounts for ~0.50% of usage. These browsers are not even supported by Microsoft anymore and have not been since January 6, 2016. Head to "Modernizr Download Builder" to appropriately build and setup your Modernizr file and base HTML page. If you don't need this old IE support, drop html5shiv and drop the need to stick it in the HEAD.

Original Answer

It's a suggestion and should generally be used; however, the case of including the modernizr.js file to enable HTML 5 must be done before the body tag. As such, you should ignore this suggestion. Per Modernizr docs ("Installing Modernizer"), for best performance you should stick them after your stylesheet references.

If you're using modernizr's included yepnope.js to conditionally load scripts or doing any other sort of setup that can go before the closing of the body though.

OTHER TIPS

There is a way to overcome that. By defining a dummy condition which stops the render-blocking.

Eg: 

<head>
...
<!--[if]><script src="vendor/modernizr.js"></script><![endif]-->
...
</head>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top