Обложка к записи Добавление атрибутов defer и async к WordPress скриптам
Время для прочтения: 1 мин. 17 сек.

Добавление атрибутов defer и async к WordPress скриптам

Разработчики WordPress очень часто неправильно ставили в очередь свои скрипты, это, зачастую, было связано с тем, что у WordPress раньше не было простого способа добавлять атрибуты async и defer.

Начиная с версии 4.1, был представлен новый фильтр script_loader_tag, который, предоставляет простой способ добавить атрибуты async/defer без ковыряний в заднем проходе.

Как использовать

Добавьте предложеный код в functions.php:

function mihdan_add_async_attribute( $tag, $handle ) {
    if ( 'my-js-handle' !== $handle ) {
        return $tag;
    }

    return str_replace( ' src', ' async="async" src', $tag );
}
add_filter( 'script_loader_tag', 'mihdan_add_async_attribute', 10, 2 );

Если вы хотите использовать атрибут defer, то просто замените в сниппете async="async на defer="defer".

Где взять идентификатор обработчика my-js-handle? Его вы можете подсмотреть в коде подключения скриптов внутри темы или плагина при помощи функции wp_register_script() и wp_enqueue_script() (первый аргумент):

wp_register_script( 'my-js-handle', $src, $deps, $ver, $in_footer );

Добавления к нескольким скриптам сразу

Что делать, если надо добавить атрибут defer сразу к нескольким скриптам? Собрать все идентификаторы обработчиков в массив и пройтись по ним циклом в том же хуке:

function mihdan_add_defer_attribute( $tag, $handle ) {
   
	$handles = array(
		'my-js-handle',
		'another-handle',
	);
   
   foreach( $handles as $defer_script) {
      if ( $defer_script === $handle ) {
         return str_replace( ' src', ' defer="defer" src', $tag );
      }
   }

   return $tag;
}
add_filter( 'script_loader_tag', 'mihdan_add_defer_attribute', 10, 2 );

Для атрибута async код будет выглядеть аналогично, за исключением девятой строки, где надо просто заменить defer="defer" на async="async.

Ссылки

Пошерить
Запинить
Отправить
Вотсап

Смотрите также

Предыдущая запись
Следующая запись

Комментарии