Предварительная загрузка изображения с помощью ajax

Нашел этот метод использования ajax для предварительной загрузки по адресу: http://perishablepress.com/3-ways-preload-images-css-javascript- ajax/

window.onload = function() {
    setTimeout(function() {
        // XHR to request a JS and a CSS
        var xhr = new XMLHttpRequest();
        xhr.open('GET', 'http://domain.tld/preload.js');
        xhr.send('');
        xhr = new XMLHttpRequest();
        xhr.open('GET', 'http://domain.tld/preload.css');
        xhr.send('');
        // preload image
        new Image().src = "http://domain.tld/preload.png";
    }, 1000);
};

Я заметил, что предварительная загрузка «ajax» для этого изображения на самом деле совсем не ajax. браузер загружает его в кеш.

Теперь представьте, что есть приложение, в котором мне нужно фактически отменить предварительную загрузку изображения, если она занимает определенное время. На самом деле нет хорошего способа сделать это с помощью просто устанавливая изображение в src, в отличие от метода xhr.abort(), который останавливает загрузку фактического запроса xhr.

Есть ли какая-либо причина, по которой выполнение некоторых действий, подобных приведенному ниже, не приведет к предварительной загрузке t изображение так же хорошо и разрешить отмену запроса на предварительную загрузку?

function preload(url, timeout){
    this.canceltimeout = function(){
        clearTimeout(this.timeout);
        this.loaded = true;
        return false;
    }

    this.abort = function(){
        this.xhr.abort();
        this.aborted = true;
    }

    //creates a closure to bind the functions to the right execution scope
    this.$_bind = function(method){
        var obj = this;
        return function (e){ obj[method](e);};
    }

    //set a default of 10 second timeout
    if(timeout == null){
        timeout = 10000;
    }

    this.aborted = false;
    this.loaded = false;
    this.xhr = new XMLHttpRequest();
    this.xhr.onreadystatechange = this.$_bind('canceltimeout');
    this.xhr.open('GET', url);
    this.xhr.send('');
    this.timeout = setTimeout(this.$_bind('abort'), timeout);
}

var llama = new preload('/image.gif');
show_image();

function show_image(){
    if(llama.loaded){
        var l = new Image();
        l.src = '/image.gif';
        application.appendChild(l);
    }else if(llama.aborted){
        var l = document.createElement('p');
        l.innerHTML = 'image.gif got cancelled';
        application.appendChild(l);
    }else{
        setTimeout(show_image, 10);
    }
    return false;
}