Preload — предварительная загрузка ресурса

Для чего используется

Preload полезен для управляемого ускорения критического пути страницы. Его не следует путать с preconnect: тот готовит соединение с источником, но не загружает указанный файл. Решение принимают по водопаду запросов и повторному измерению.

Как SEO-специалист использует это в проекте

В проекте preload рассматривают, когда важный ресурс обнаруживается слишком поздно: например, шрифт или изображение из CSS. SEO-специалист фиксирует задержку, разработчик проверяет цепочку запросов и выбирает точечную подсказку. Сначала нужно доказать проблему обнаружения, а не добавлять preload по списку всех файлов.

1. Найдите важный ресурс, который браузер обнаруживает поздно.
2. Добавьте подсказку для точного адреса и назначения с корректными параметрами.
3. Проверьте время начала запроса, повторные загрузки и показатели страницы после изменения.

Ошибки и риски

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

Предзагружать все картинки; забывать as; указывать другой URL, чем в CSS; считать отсутствие предупреждения доказательством ускорения.

Как проверить результат

Сравните водопад запросов при одинаковом устройстве и сети. Подсказка должна помогать конкретному ресурсу без лишних скачиваний и задержки более важного содержимого. Неиспользуемый preload удаляют после проверки.

Связанные термины

• Preconnect — раннее соединение с источником
• Lazy loading — отложенная загрузка
• Lighthouse