Не знаю насколько правильно и оптимально, но по наитию пользуюсь этой функцией
$.preloadImagesS = function () {
if (typeof arguments[arguments.length - 1] == 'function') {
var callback = arguments[arguments.length - 1];
} else {
var callback = false;
}
var Img = arguments[0]
$(new Image()).load(function(){
if (typeof callback == 'function') {
callback();
}
}).attr('src', Img);
}
Пользуюсь так
1. Показываю в img спинер (крутилку)
2. Вызываю функцию
$.preloadImagesS (IMG_URL, function(){ /*обратны вызов*/ });
Если картинка в кеше - всё происходит мгновенно.