На сегодня - любопытная статья про способы предзагрузки изображений в JS, с плюсами/минусами, примерами и аргументацией. Ну а если сократить до сухих фактов:
-
new Image(): Простой способ с доступом к размерам и событию загрузки, но ненадежен при запрете кэширования на сервере (no-store).-
<link rel="preload">: Лучший выбор. Гарантированно кэширует изображение (игнорируя no-store) и предотвращает дублирование запросов.- Скрытый
<div>: Работает только с visibility: hidden (не `display: none`). Считается «костылем» без особых преимуществ.-
Cache API и fetch(): Дают полный программный контроль и работу с данными в памяти, но требуют ручной очистки кэша или хранения Blob-объектов.Статья: https://macarthur.me/posts/preloading-images/
