I read on the WP docs, which pointed to this gist that the correct way to enqueue styles for IE is by using the $wp_styles
. I'm guessing that this would be true then for scripts as well.
Take these examples for instance...
Option One - Using wp_scripts
add_action('wp_print_scripts', function() {
global $wp_scripts;
wp_enqueue_script( 'html5shiv', 'https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js', array( 'bootstrap' ) );
$wp_scripts->add_data( 'html5shiv', 'conditional', 'lt IE 9' );
} );
Option Two - Use wp_scripts
along with is_IE
add_action('wp_print_scripts', function() {
global $wp_scripts, $is_IE;
if($is_IE) {
wp_enqueue_script( 'html5shiv', 'https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js', array( 'bootstrap' ) );
$wp_scripts->add_data( 'html5shiv', 'conditional', 'lt IE 9' );
}
} );
Option Three - Just echo it in the head :
add_action('wp_head', function(){
echo '<!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><![endif]-->' . "\n";
});
Option Four - Enqueue it to the head :
add_action('wp_print_scripts', function(){
wp_enqueue_script( 'html5shiv', 'https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js', array( 'bootstrap' ) );
});
The second option. seems cool because it looks a little cleaner on non-IE browsers. But I'm not sure if it actually has any speed advantage or if the check alone slows it down more. Other than that I can't seem to figure out any reason why option one is better than option 3 or 4.
The reason for this question
I'm using the Genesis framework and they include HTML5shiv like the example below which just didn't seem right to me:
add_action( 'wp_head', 'genesis_html5_ie_fix' );
/**
* Load the html5 shiv for IE8 and below. Can't enqueue with IE conditionals.
*/
function genesis_html5_ie_fix() {
if ( ! genesis_html5() )
return;
echo '<!--[if lt IE 9]><script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->' . "\n";
}