Заранее загрузить картинку / видео (preload)

Когда сайт представляет из себя сервис фото или видео, то рекомендуется заранее загружать следующее или предыдущее фото или видео, чтобы пользователь не ждал каждый раз загрузки ресурса.

Это можно сделать через тег <link rel="preload">.

<link rel="preload" href="http://site.ru/pic.jpg" as="image">
<link rel="preload" href="http://site.ru/watch.mp4" as="video">
<link rel="preload" href="http://site.ru/track.mp3" as="audio">

Рекомендуется указывать атрибут as, чтобы браузер понимал, как надо обрабатывать файл.

Также есть тег <link rel="prefetch">, который работает аналогично, только у него низкий приоритет к загрузке. В этой ситуации не рекомендуется использовать, т.к. пользователь может сразу перейти на следующую страницу, и картинка или видео не успеет заранее загрузиться.