Автоматическое отключение внешних embed-контентов в WordPress для ускорения сайта

Внешние embed-контенты, такие как видео с YouTube, твиты, посты из Instagram и других сервисов, часто значительно замедляют загрузку страниц WordPress. Каждый такой элемент вызывает дополнительные HTTP-запросы, загружает сторонние скрипты и стили, что негативно сказывается на скорости и пользовательском опыте.

В этой статье мы подробно рассмотрим, как автоматически отключать внешние embed-контенты на сайте WordPress, минимизируя их влияние на производительность без потери функционала. Рассмотрим два подхода: программное отключение через functions.php и использование специализированных плагинов.

Почему стоит отключать внешние embed-контенты?

Когда вы вставляете, например, видео с YouTube, WordPress автоматически превращает ссылку в embed и загружает iframe, а также подключает скрипты YouTube API. Аналогично с твитами и Instagram-постами — каждый embed вызывает загрузку множества внешних ресурсов. Это приводит к нескольким проблемам:

• Увеличение времени загрузки страницы (TTFB и полная загрузка)
• Увеличение количества запросов к сторонним серверам
• Потенциальные проблемы с конфиденциальностью пользователей
• Замедление работы на мобильных устройствах и слабых соединениях

Автоматическое отключение или отложенная загрузка embed-контентов помогает улучшить показатели Core Web Vitals и повысить общую производительность сайта.

Как отключить embeds программно через functions.php

WordPress предоставляет фильтры и хуки для управления oEmbed. Ниже приведён пример кода, который отключает автоматический рендеринг всех внешних embed-контентов.

function wpfront_disable_embeds() {
    // Отключаем oEmbed REST API endpoint
    remove_action('rest_api_init', 'wp_oembed_register_route');
    // Отключаем oEmbed discovery
    add_filter('embed_oembed_discover', '__return_false');
    // Отключаем oEmbed фильтр в контенте
    remove_filter('the_content', [\WP_Embed::class, 'autoembed'], 8);
    // Отключаем JavaScript wp-embed.js
    add_action('wp_footer', function() {
        wp_dequeue_script('wp-embed');
    });
}
add_action('init', 'wpfront_disable_embeds');

Этот код отключает все встроенные embed-подгрузки, оставляя только простой URL в тексте. Таким образом, пользователь увидит ссылку, но не будет загружен iframe или скрипты.

Отложенная загрузка embed с помощью плагинов

Если полностью отключать embed нельзя, например, когда контент важен, можно использовать плагины, которые загружают embed лениво — только когда пользователь доскроллит до блока, или по клику.

Рассмотрим пару полезных плагинов:

• Lazy Load for Videos — заменяет видео iframe на картинку-превью, загружая видео только при клике.
• Disable Embeds — простой плагин для полного отключения oEmbed.

Для установки плагинов можно использовать репозиторий WordPress или загрузить с https://wpshop.ru с нужными метками.

Пример гибридного решения: отключение embed с заменой на превью

Можно сделать свой простой код, который отключает автоматическое встраивание, но заменяет ссылки на видео на картинку с кнопкой воспроизведения. При клике загружается iframe.

function wpfront_lazy_embed_video($content) {
    if (preg_match_all('/https:\/\/www\.youtube\.com\/watch\?v=([\w-]+)/', $content, $matches)) {
        foreach ($matches[0] as $url) {
            $video_id = wpfront_extract_youtube_id($url);
            $preview = 'https://img.youtube.com/vi/' . esc_attr($video_id) . '/hqdefault.jpg';
            $replacement = '<div class="wpfront-lazy-video" data-video-id="' . esc_attr($video_id) . '">'
                . '<img src="' . $preview . '" alt="Видео YouTube" style="max-width:100%;cursor:pointer;" />'
                . '<div class="wpfront-play-button">▶</div></div>';
            $content = str_replace($url, $replacement, $content);
        }
    }
    return $content;
}
add_filter('the_content', 'wpfront_lazy_embed_video');

function wpfront_extract_youtube_id($url) {
    parse_str(parse_url($url, PHP_URL_QUERY), $vars);
    return $vars['v'] ?? '';
}

И добавьте следующий JavaScript в футер темы, чтобы при клике подменять превью на iframe:

document.addEventListener('DOMContentLoaded', function() {
    document.querySelectorAll('.wpfront-lazy-video').forEach(function(el) {
        el.addEventListener('click', function() {
            var videoId = el.getAttribute('data-video-id');
            var iframe = document.createElement('iframe');
            iframe.setAttribute('src', 'https://www.youtube.com/embed/' + videoId + '?autoplay=1');
            iframe.setAttribute('frameborder', '0');
            iframe.setAttribute('allowfullscreen', '');
            iframe.style.width = '100%';
            iframe.style.height = '360px';
            el.innerHTML = '';
            el.appendChild(iframe);
        });
    });
});

Дополнительные советы по оптимизации embed

Чтобы дополнительно улучшить работу с embed, рекомендуем:

• Использовать кеширование страниц и объектов
• Отключать embed-скрипты на страницах, где они не нужны, через условные теги
• Использовать CDN для ускорения загрузки статических ресурсов
• Проводить регулярный аудит плагинов и тем на предмет избыточных embed-сценариев

Все эти меры в комплексе дадут заметный прирост скорости и улучшат SEO сайта.

Заключение

Отключение внешних embed-контентов — это эффективный способ ускорить сайт на WordPress, особенно если вы не хотите жертвовать удобством пользователей. В статье приведены примеры, как это сделать программно и через плагины, а также показано, как реализовать ленивую загрузку видео с YouTube через кастомный код.

Для дополнительного удобства можете посмотреть плагины на WPSHOP, где есть много полезных инструментов для оптимизации WordPress.