preload image

index.js

function preloadImage(src) {
    const $dom = $("<img />", {
        src
    });

    if ($dom[0].naturalWidth) {
        return Promise.resolve($dom);
    }
    $dom.css({
        opacity: 0.01,
        position: 'fixed',
        bottom: 0,
        left: 0,
        height: '1px',
        width: '1px',
        'z-index': 10000,
        'pointer-events': 'none',
    });

    $(document.body).append($dom);
    return new Promise((resolve) => {
        $dom.on("load", () => {
            $dom.detach();
            resolve($dom);
        });
    });
}

non-jq-edition.js

function preloadImage(src) {    
    const dom=document.createElement("img");

    if (dom.naturalWidth) {
        return Promise.resolve(dom);
    }
    dom.setAttribute("src",src);
    dom.setAttribute('style','opacity:0.01;position:fixed;bottom:0;left:0;height:1px;width:1px;z-index:10000;pointer-events:none;');
    
    document.body.appendChild(dom);
    return new Promise(resolve => {
        dom.addEventListener('load',()=>{
            document.body.removeChild(dom);
            resolve(dom);
        });        
    });
}