Как добавить DNS Prefetch в WordPress

DNS prefetch (предзагрузка DNS) – это простой способ ускорения работы WordPress-сайта. Суть этого метода заключается в установлении раннего соединения со сторонними доменами. Чтобы выполнить этот трюк в WordPress, нужно добавить следующий код в хэдер:

<link rel="dns-prefetch" href="https://example.com">

Вот еще несколько сторонних доменов, которые можно предварительно загрузить:

<link rel="dns-prefetch" href="https://cdn.domain.com">
<link rel="dns-prefetch" href="https://fonts.gstatic.com">
<link rel="dns-prefetch" href="https://connect.facebook.net">
<link rel="dns-prefetch" href="https://www.google-analytics.com">
<link rel="dns-prefetch" href="https://www.googletagservices.com">

Выполнить DNS prefetch можно с помощью следующих плагинов: WP Rocket, Perfmatters, Pre* Party Resources Hints, SG Optimizer, LiteSpeed Cache. Также большинство плагинов кэширования, существующих на рынке, имеют эту опцию.

Просмотрите отчеты PageSpeed Insights или GTmetrix, чтобы понять, какие сторонние домены загружаются на вашем сайте. Как только вы найдете их, просто скопируйте и вставьте их в список предзагруженных доменов.

В WP Rocket выполнить prefetch можно во вкладке Preload:

В плагине Perfmatters это можно сделать во вкладке Extras > Preloading:

SG Optimizer позволяет задавать DNS Prefetch для сторонних доменов в настройках Environment Optimization:

LiteSpeed Cache позволяет настраивать предзагрузку DNS на странице Page Optimization > Optimizations > DNS Prefetch. Здесь же можно дополнительно установить настройки DNS Prefecth Control. С его помощью можно будет расширить действие Prefetch на все ссылки в документе, включая ссылки на страницы, изображения, CSS, JS и т.д.

Рекомендуемый список доменов для prefetch вы можете найти на Github. Я также составил свой список. Если я упустил какие-либо домены, отпишитесь в комментариях, я их добавлю:

<link rel="dns-prefetch" href="https://maps.googleapis.com">
<link rel="dns-prefetch" href="https://maps.gstatic.com">
<link rel="dns-prefetch" href="https://fonts.googleapis.com">
<link rel="dns-prefetch" href="https://fonts.gstatic.com">
<link rel="dns-prefetch" href="https://ajax.googleapis.com">
<link rel="dns-prefetch" href="https://apis.google.com">
<link rel="dns-prefetch" href="https://google-analytics.com">
<link rel="dns-prefetch" href="https://www.google-analytics.com">
<link rel="dns-prefetch" href="https://ssl.google-analytics.com">
<link rel="dns-prefetch" href="https://youtube.com">
<link rel="dns-prefetch" href="https://api.pinterest.com">
<link rel="dns-prefetch" href="https://cdnjs.cloudflare.com">
<link rel="dns-prefetch" href="https://domain.kinstacdn.com">
<link rel="dns-prefetch" href="https://pixel.wp.com">
<link rel="dns-prefetch" href="https://connect.facebook.net">
<link rel="dns-prefetch" href="https://platform.twitter.com">
<link rel="dns-prefetch" href="https://syndication.twitter.com">
<link rel="dns-prefetch" href="https://platform.instagram.com">
<link rel="dns-prefetch" href="https://disqus.com">
<link rel="dns-prefetch" href="https://sitename.disqus.com">
<link rel="dns-prefetch" href="https://s7.addthis.com">
<link rel="dns-prefetch" href="https://platform.linkedin.com">
<link rel="dns-prefetch" href="https://w.sharethis.com">
<link rel="dns-prefetch" href="https://s1.wp.com">
<link rel="dns-prefetch" href="https://1.gravatar.com">
<link rel="dns-prefetch" href="https://s.gravatar.com">
<link rel="dns-prefetch" href="https://stats.wp.com">
<link rel="dns-prefetch" href="https://www.googletagmanager.com">
<link rel="dns-prefetch" href="https://www.googletagservices.com">
<link rel="dns-prefetch" href="https://adservice.google.com">
<link rel="dns-prefetch" href="https://pagead2.googlesyndication.com">
<link rel="dns-prefetch" href="https://tpc.googlesyndication.com">
<link rel="dns-prefetch" href="https://securepubads.g.doubleclick.net">
<link rel="dns-prefetch" href="https://bp.blogspot.com">
<link rel="dns-prefetch" href="https://1.bp.blogspot.com">
<link rel="dns-prefetch" href="https://ajax.microsoft.com">
<link rel="dns-prefetch" href="https://ajax.aspnetcdn.com">
<link rel="dns-prefetch" href="https://s3.amazonaws.com">
<link rel="dns-prefetch" href="https://a.opmnstr.com">
<link rel="dns-prefetch" href="https://script.hotjar.com">
<link rel="dns-prefetch" href="https://i.ytimg.com">
<link rel="dns-prefetch" href="https://code.jquery.com">
<link rel="dns-prefetch" href="https://stackpath.bootstrapcdn.com">
<link rel="dns-prefetch" href="https://use.fontawesome.com">
<link rel="dns-prefetch" href="https://player.vimeo.com">
<link rel="dns-prefetch" href="https://github.githubassets.com">
<link rel="dns-prefetch" href="https://referrer.disqus.com">
<link rel="dns-prefetch" href="https://c.disquscdn.com">
<link rel="dns-prefetch" href="https://ad.doubleclick.net">
<link rel="dns-prefetch" href="https://googleads.g.doubleclick.net">
<link rel="dns-prefetch" href="https://stats.g.doubleclick.net">
<link rel="dns-prefetch" href="https://cm.g.doubleclick.net">
<link rel="dns-prefetch" href="https://stats.buysellads.com">
<link rel="dns-prefetch" href="https://s3.buysellads.com">

Добавить правила DNS Prefetching можно также вручную через functions.php вашей темы:

//* DNS Prefetching
function dns_prefetch() {
    echo '<meta http-equiv="x-dns-prefetch-control" content="on">
<link rel="dns-prefetch" href="https://www.google-analytics.com" />
<link rel="dns-prefetch" href="https://www.googletagmanager.com" />
<link rel="dns-prefetch" href="https://fonts.googleapis.com" />
}
add_action('wp_head', 'dns_prefetch', 0);

Источник: onlinemediamasters.com

Блог про WordPress
Добавить комментарий

Получать новые комментарии по электронной почте.