Предварительная загрузка изображений в Firefox не извлекается из кеша при одной и той же загрузке страницы.

Question

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

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

JavaScript, который работает на загрузке страницы, принимает все URL-адреса изображений и пытается предварительно загрузить их через вызов (new Image()).src = 'http:// ...'; для каждого.

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

Test Image Link (SO репутационные ограничения): http://i.stack.imgur.com/E9KLM.png

В изображении, изображения -66.png, -21.png, -63.png и -83.png были предварительно загружены с JavaScript, но затем снова запрашиваются, когда слайдер показывает этот слайд.

Странно, что нижние изображения выглядят так, как будто они были поставлены в очередь для загрузки, поскольку страница была создана. Может быть, это потому, что это имеет приоритет над сценарием, который был загружен после того, как документ был готов?

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

Моей теорией является то, что оригинальные фоновые изображения, возможно, объявлены нуждающимися в загрузке с сервера при первой загрузке страницы, но на самом деле не загружаются до тех пор, пока слайд не будет обнаружен. Когда документ готов, когда javascript предварительно загружает изображения, они еще не кэшируются, поэтому их необходимо загрузить с сервера. Затем открывается слайд, и браузер сообщает об этом изображении, которое нужно загрузить, как было объявлено ранее.

Кто-нибудь знает, почему эта ситуация происходит? Если да, есть ли какие-либо решения для решения?

У меня есть идея, которая включает добавление URL-адресов изображений в качестве атрибута url-данных вместо этого, а затем предварительную загрузку javascript и добавление их в качестве фоновых изображений в этот момент, но я еще не тестировал это.

Answer 1

Для желающих мы не смогли найти идеальное решение для этого.

Однако мы заметили, что изображения были вытащены снова в зависимости от их размера. Чем больше размер изображения, тем более вероятно, что изображение не было извлечено из кеша, когда изображение было показано пользователю.

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