dns-prefetch про что это? и как использовать?

- · Опубликовано · Обновлено

DNS-prefetch (предзагрузка DNS) — это попытка определить IP адрес по имени домена до того, как ресурс с этого домена будет фактически запрошен. Это может быть загрузчик файлов, который используется позже или ссылка, по которой, вероятнее всего, перейдёт пользователь.

Зачем использовать dns-prefetch?

Бывают случаи, когда в вашем приложении используются ссылки на домены, отличные от основного домена приложения. Например, внутри вашего приложения на «a.com» есть ссылка на домен «b.org». Для того, чтобы пройти по этой ссылке, пользовательский клиент должен сначала выяснить, какой адрес в интернете соответствует доменному имени «b.org». Этот процесс называется DNS resolution. И хотя механизмы кеширования DNS помогают сократить время запросов, DNS Resolution заметно влияет на время ожидания запроса из-за того, что первый клиентский запрос уходит сначала на DNS сервера и дожидается ответа от них. Для приложений, которые открывают соединения ко многим сторонним доменам, влияние DNS Resolution может сильно уменьшить производительность загрузки.

dns-prefetch помогает разработчикам замаскировать ожидание DNS resolution. HTML <link> элемент предлагает подобную функциональность с помощью атрибута rel, значение которого может содержать dns-prefetch. В этом случае, предзагрузка DNS произойдёт для домена, указанного в атрибуте href:

Синтаксис:

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

Пример:

<html>
  <head>
    <link rel="dns-prefetch" href="https://fonts.gstatic.com/">
    <!-- and all other head elements -->
  </head>
  <body>
    <!-- your page content -->
  </body>
</html>

Вы должны помещать dns-prefetch подсказки в элемент <head> для каждого уникального стороннего домена, с которого могут быть запрошены ресурсы, но нужно держать некоторые детали в голове.

Источник developer.mozilla.org

Метки: