首页 > 解决方案 > 幻灯片的预加载图像没有按预期更快地呈现

问题描述

我创建了一个图像轮播,并希望预加载图像只是为了更快的渲染和更好的用户体验。但是加载速度似乎并没有那么快。我可以看到文件正在加载到 windows/chrome 的缓存文件夹中,但看起来浏览器仍然没有从那里获取它们,而是从图像所在的 js 文件中获取它们。

    window.onload = function () {

    const europeMap = []
    for (let pic of countries) {
        const photo = pic.imagebig.split("/")[1]
        europeMap.push(photo)
    }

    const pics = [...europeMap, ...images]

    for (var i = 0; i < pics.length; ++i) {
        let imageObject = new Image();
        imageObject.onload = function () {
            console.log(`${pics.length} images loaded!`);
        }
        imageObject.src = `images/${pics[i]}`;
    }
}

    
     

标签: javascriptonloadpreload

解决方案


推荐阅读