Seit WordPress 6.3 ist es möglich, Scripten, die mit der Funktion wp_enqueue_script() in ein Template oder ein Plugin eingebunden werden, nun auch ein defer oder async Attribut mitzugeben. Im fünften Parameter kann hierzu optional als „strategy“ entweder „defer“ oder „async“ definiert werden, wie im folgenden Beispiel bei der Einbindung der beiden Scripte foo.js und bar.js in ein Template:
function my_enqueue_scripts() {
wp_enqueue_script(
'foo',
get_template_directory_uri() . '/js/foo.js',
array(),
"1.2.3",
array( 'strategy' => 'defer' )
);
wp_enqueue_script(
'bar',
get_template_directory_uri() . '/js/bar.js',
array( 'foo' ),
"2.3.4",
array( 'strategy' => 'defer' )
);
}
add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts' );
Vor WordPress 6.3 wäre hierzu etwas umständlich ein nachträglicher Einbau mit einer Funktion wie str_place() über den Hook script_loader_tag notwendig gewesen. Der obige Code wäre entsprechend etwas komplexer ausgefallen:
function my_enqueue_scripts() {
wp_enqueue_script(
'foo',
get_template_directory_uri() . '/js/foo.js',
array(),
"1.2.3"
);
wp_enqueue_script(
'bar',
get_template_directory_uri() . '/js/bar.js',
array( 'foo' ),
"2.3.4"
);
}
add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts' );
function my_add_defer_attribute( $tag, $handle ) {
if ( in_array(
$handle,
array( 'foo', 'bar' ),
true
) ) {
return str_replace( ' src', ' defer src', $tag );
}
return $tag;
}
add_filter( 'script_loader_tag', 'my_add_defer_attribute', 10, 2 );
Von daher eine sinnvolle Erweiterung von wp_enqueue_script(), wie ich finde.