rel=preconnect

Ключевое слово preconnect для атрибута rel элемента <link> — это подсказка для браузеров о том, что пользователю, вероятно, понадобятся ресурсы из источника целевого ресурса. Таким образом, браузер может улучшить пользовательский опыт, предварительно инициировав соединение с этим источником. Предварительное подключение ускоряет будущие загрузки из данного источника, предварительно выполнив часть или все рукопожатие (DNS+TCP для HTTP и DNS+TCP+TLS для HTTPS-источников).

<link rel="preconnect"> будет полезным для любых будущих кросс-доменных HTTP-запросов, навигации или подзагрузок. Оно не приносит никакой пользы для запросов из одного источника, так как соединение уже открыто.

Если странице нужно установить соединения со многими сторонними доменами, то предварительное подключение всех из них может быть неэффективным. Намек <link rel="preconnect"> лучше использовать только для самых важных соединений. Для остальных используйте <link rel="dns-prefetch">, чтобы сэкономить время на первом шаге — поиске DNS.

Примеры

html

<link rel="preconnect" href="https://example.com" />

Вы также можете реализовать предварительное подключение как HTTP-заголовок Link, например:

http

Link: <https://example.com>; rel="preconnect"

Спецификации

Спецификация
Стандарт HTML # link-type-preconnect

Совместимость с браузерами

	Рабочий стол					Мобильные устройства
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox для Android	Opera Android	Safari на iOS	Samsung Internet	WebView Android
`preconnect`	46	79	39 До Firefox 41 не подчиняется атрибуту `crossorigin`.	33	11.1	46	39 До Firefox 41 не подчиняется атрибуту `crossorigin`.	33	11.3	4.0	46

См. также

Спекулятивная загрузка для сравнения <link rel="preconnect"> и других аналогичных функций улучшения производительности.

© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/preconnect