Emoji — это забавные иконки, которые автоматически добавляются в WordPress с версии 4.2. Хотя они делают текст более выразительным, для многих проектов загрузка лишних скриптов и стилей Emoji не нужна и негативно влияет на скорость загрузки сайта. В этой статье разберёмся, как отключить Emoji в WordPress, чтобы убрать лишние запросы и ускорить работу сайта.
Почему стоит отключить Emoji в WordPress: влияние на производительность
По умолчанию WordPress подключает скрипты и стили для поддержки Emoji. Это приводит к дополнительным HTTP-запросам, которые увеличивают время загрузки страницы. Особенно это заметно на мобильных устройствах и при использовании медленных соединений.
Кроме того, отключение Emoji уменьшает размер загружаемых файлов, что важно для сайтов с большим трафиком и ограничениями по ресурсам хостинга.
По данным плагина WPChecker, отключение Emoji может сократить время загрузки на 100-200 миллисекунд, что положительно сказывается на SEO и пользовательском опыте.
Отключение Emoji средствами WordPress: базовый код
Для отключения Emoji добавьте следующий код в файл functions.php вашей темы или в собственный плагин:
function wpchecker_disable_emojis() {
remove_action('wp_head', 'print_emoji_detection_script', 7);
remove_action('admin_print_scripts', 'print_emoji_detection_script');
remove_action('wp_print_styles', 'print_emoji_styles');
remove_action('admin_print_styles', 'print_emoji_styles');
remove_filter('the_content_feed', 'wp_staticize_emoji');
remove_filter('comment_text_rss', 'wp_staticize_emoji');
remove_filter('wp_mail', 'wp_staticize_emoji_for_email');
add_filter('tiny_mce_plugins', 'wpchecker_disable_emojis_tinymce');
add_filter('wp_resource_hints', 'wpchecker_remove_emoji_dns_prefetch', 10, 2);
}
add_action('init', 'wpchecker_disable_emojis');
function wpchecker_disable_emojis_tinymce($plugins) {
if (is_array($plugins)) {
return array_diff($plugins, array('wpemoji'));
}
return array();
}
function wpchecker_remove_emoji_dns_prefetch($urls, $relation_type) {
if ('dns-prefetch' == $relation_type) {
$emoji_svg_url = 'https://s.w.org/images/core/emoji/';
foreach ($urls as $key => $url) {
if (strpos($url, $emoji_svg_url) !== false) {
unset($urls[$key]);
}
}
}
return $urls;
}
Этот код полностью отключит загрузку Emoji-скриптов и стилей как на фронтенде, так и в админке WordPress, а также уберёт DNS-prefetch для Emoji ресурсов.
Использование плагинов для отключения Emoji
Если вы не хотите работать с кодом напрямую, можно использовать плагины, которые делают то же самое. Например:
- Clearfy — многофункциональный плагин оптимизации, в котором есть опция отключения Emoji одним кликом. Подробнее на официальной странице.
- Disable Emojis — простой и лёгкий плагин, отключающий Emoji без лишних настроек.
- WP Rocket — плагин для кэширования и оптимизации, который также позволяет отключать Emoji для ускорения сайта.
Выбор зависит от ваших задач и предпочтений. Если у вас уже есть Clearfy или WP Rocket, просто активируйте соответствующую настройку.
Как проверить, что Emoji действительно отключены
После внесения изменений проверьте исходный код страницы. Ранее в <head> выводился скрипт для Emoji:
<script src="https://s.w.org/images/core/emoji/2/svg.js"></script>
Если вы его не видите, значит отключение сработало.
Также можно использовать инструменты разработчика браузера (Network) для проверки отсутствия запросов к Emoji ресурсам.
Для более глубокого анализа производительности рекомендую воспользоваться плагином WPChecker, который покажет, какие скрипты и стили загружаются на сайте и как это влияет на скорость.
Дополнительные советы по оптимизации загрузки скриптов в WordPress
Отключение Emoji — лишь одна из мер оптимизации. Чтобы улучшить скорость сайта, также рекомендуется:
- Удалять неиспользуемые плагины и темы.
- Оптимизировать изображения с помощью инструментов и плагинов.
- Использовать кэширование страниц и сжатие ресурсов.
- Минимизировать и объединять CSS и JS-файлы.
- Отложенную загрузку скриптов (defer, async).
Пример кода для отложенной загрузки скриптов (defer):
function wpchecker_add_defer_attribute($tag, $handle) {
$scripts_to_defer = array('my-script-handle');
if (in_array($handle, $scripts_to_defer)) {
return str_replace(' src', ' defer src', $tag);
}
return $tag;
}
add_filter('script_loader_tag', 'wpchecker_add_defer_attribute', 10, 2);
Замените my-script-handle на хендл скрипта, который хотите загрузить с атрибутом defer.