How to get DEFER or ASYNC attribute to appear when I add a stylesheet with wp_enqueue_style from a plugin? [duplicate]

Question

Almost all of my CSS and JS resources can be postponed with an ASYNC or DEFER tag added to the resource. This may improve performance of my page load times considerably. However, I don't know how to specify these attributes to be added to the HEAD when wp_enqueue_style() takes care of adding them. It doesn't seem like wp_enqueue_script() takes a parameter for extra attributes. Is there another way?

Answer 1

As per WP Code Snippet blog, it looks like this is one way:

Add this code snippet to your functions.php file.

// add async and defer to javascripts

function wcs_defer_javascripts ($url) 
{
    if (strpos($url, '.js') === FALSE) { 
        return $url;
    }
    if (strpos($url, 'jquery.js')) { 
        return $url;
    }
    return "$url' async onload='myinit()";
}
add_filter('clean_url', 'wcs_defer_javascripts', 11, 1);