Search code examples
javascriptperformanceasynchronousmodernizr

Is it okay to async modernizr?


Google PageSpeed test is telling me to use async

E.g. change

<script src="//cdnjs.cloudflare.com/ajax/libs/modernizr/2.6.2/modernizr.min.js"></script>

To

<script async src="//cdnjs.cloudflare.com/ajax/libs/modernizr/2.6.2/modernizr.min.js"></script>

Will modernizer still work just fine?


Solution

  • Modernizr needs to be placed in the <head> for two reasons:

    1. html5shiv needs to be there for oldIE.
    2. avoiding the FOUC when using modernizr-placed classes for feature-conditional styling

    You can use an async attribute and/or place it at the bottom if neither of these matter to you.

    Look at this issue posted in Modernizr