Что такое rel=dns-prefetch?
Пример использования
<link rel="dns-prefetch" href="https://cdn.varvy.com">
Приведенный выше код означает:
Цель
Основная цель использования rel=dns-prefetch – это ускорение загрузки веб-страниц, когда для страниц используются разные домены.
Процесс запроса и загрузки страницы оптимизируется, благодаря эффективному контролю.
Процесс часто называют "DNS prefetching".
Определение W3C
"Предзапрос ссылки, используется для определения источника, который будет использован для загрузки необходимых ресурсов, а также для того, чтобы браузер получил данные как можно быстрее."
Где используется rel="dns-prefetch" used?
В тэге head документа.
Важность применения DNS предзагрузки
В жизни можно быть уверенным в двух вещах — в смерти и налогах.
При загрузке страницы, можно быть уверенным в одном запросе DNS на один домен.
Это значит, если ваша страница найдена на трех доменах, будет сделано соответственно минимум три запроса. Если вы используете ресурсы с 10 доменов, вы получите минимум 10 запросов.
Поэтому используйте возможность минимизировать dns запросы.
Где полезно применять DNS предзагрузку?
Например, у вас на сайте целая пачка js файлов, которые используются при загрузке страницы. У вас также могут использоваться другие сторонние инструменты (adsense, seo инструменты, инструменты маркетинга и т.д.).
В реальности вы не знаете наверняка, какие файлы браузер начнет загружать в первую очередь.
Вы точно знаете, что будет задействован CDN.В данном случае самое время использовать DNS предзапрос, потому что тогда в первую очередь будет выполнен запрос к DNS, а не загрузка сторонних файлов.Т.е. Данная практика позволит быстрее отобразить страницу.
Предзапрос DNS фактически дает вам возможность контролировать то, как страница будет загружаться, «намекая» браузеру, с чего начать.
Где НЕ полезен DNS предзапрос?
Если все ресурсы и файлы страницы лежат на одном домене с html.
Если все файлы js, css, картинки и т. д. лежат на одном домене вместе с самим сайтом, тогда нет необходимости указывать предзапрос, это может только навредить.
Как правило лучше правильно организовать веб-страницу, чем делать предзапросы.
Перед тем как делать предзапрос DNS, возможно вам стоит узнать как можно уменьшить количество вызовов доменов. Я понимаю, что не на каждом сайте это можно сделать, но все же задайте себе 3 вопроса:
- Есть ли на странице ресурсы с разных доменов?
- Данные ресурсы вызываются одинаково?
- Могу ли я уменьшить кол-во доменов?
1. Есть ли на странице ресурсы с разных доменов?
Если HTML файл лежит на домене example.com, а CSS на cdn.example.com, а картинки подгружаются с 1234bucket.cdn.com, значит вы делаете загрузку с трех разных доменов, а могли бы перенести все эти ресурсы на один.
2. Данные ресурсы вызываются одинаково?
Если один CSS файл грузится c "www.example.com", а другой с "example.com", нужно это исправить. Убедитесь, что оба ресурса вызываются либо с версии www либо без "www".
То же самое касается https vs http, довольно распространенная практика.
3. Могу ли я уменьшить кол-во доменов?
Проверьте, все ли указанные на сайте ресурсы действительно нужны. Такие файлы как шрифты-иконки, плагины, социальные кнопки и т.д. часто используются не на каждой странице сайта, однако все равно вызываются.
Узнайте, как загружаются ваши страницы, с помощью сервиса page resource tool, так вы узнаете какие домены вызываются при загрузке.
