Вот кое-что, что вы можете попробовать, и я случайно кодировал его:
(function() {
var imgs = [ "image1.png", "image2.png", ... /* all your image names */ ],
index = 0,
img;
function loader() {
if (index >= imgs.length) return;
(img = new Image()).onload = loader;
setTimeout(function() { img.src = "/path/to/images/" + imgs[index++]; }, 1);
}
loader();
})();
Поместите все имена ваших изображений (или те, которые вы хотите предварительно загрузить) в массив, и убедитесь, что этот скрипт запускаетсявверх, когда ваши страницы начинают загружаться.Он проработает список изображений, загрузит их, а затем перейдет к следующему, когда закончится каждое изображение.(Вызов setTimeout предназначен для того, чтобы убедиться, что обработчик "onload" не вызывается, пока вы все еще внутри обработчика.)
Возможно, вы захотите сделать это для большого количества "орехи и болты "изображения для всего сайта - иными словами, каждая страница будет пытаться загрузить изображения для всего.Конечно, как только они попадут в кеш, это не займет много времени.В качестве альтернативы, вы можете запустить этот скрипт только на нескольких страницах, таких как экраны входа в систему и главная «домашняя страница».Конечно, если у вас есть такой сайт, как Flickr, вы, вероятно, не захотите предварительно загружать все ваших изображений: -)