图片懒加载

const img = new Image();
img.src = 'preload.png';

// 预防缓存可以增加时间戳
img.src = 'preload.png' + '?' + Date.now();
img.onload = function () {
    ...
}

class Preloader {
    private activeCount = 0;
    constructor(maxParalled = 3) {
        this.queue = [];
        this.maxParalled = maxParalled;
    }
    
    add(url) {
        this.queue.push(url);
        this.loadNext();
    }
    
    loadNext() {
        while (this.activeCount < this.maxParalled && this.queue.length) {
            const url = this.queue.shift();
            this.activeCount++;
            
            const img = new Image();
            img.src = url;
            this.onload = img.onerror = () => {
                this.activeCount--;
                this.loadNext();
            }
        }
    }
}


// demo
const preloader = new Proloader();
preloader.add('test.png');