为什么JS预加载看起来比加载常规图像引用要花费更长时间？

Question

我有一堆图像，我在循环内预加载。中的一个 这些图像也是由html加载的，所以我很好地了解了如何 这两种不同的方法表现。对于测量，我使用的是 清除缓存后，Safari Web Inspector的网络窗格。

ClownFish图像为280KB，当HTML引用时需要14ms到
加载，而JS在预加载中引用的Aurora图像是
116KB，加载时间为77ms。

var images = ['Aurora', 'ClownFish', 'DewDrop', 'EarthHorizon',  'FlowingRock', 'GentleRapids', 'GoldenPalace'];
images.each(function(elm){
    var path = elm + '.jpg';
    var preload = new Image();
    preload.setAttribute('src',path);
});

这是设置Image（）然后分配
所有开销 src到了吗？有什么方法可以加快速度吗？

Answer 1

您是否检查过Firefox中是否也是这种情况（使用Firebug）？那些加载时间是检索图像本身需要多长时间？或者是从请求开始到加载图像多长时间？

如果是后者，它可能与javascript在页面上加载的位置/时间有关，或者浏览器已经有太多的请求到域的图像，并且必须等到其中一些完成之前预加载图像。

如果你根本没有预加载图像，我也很想知道加载时间有多长。如果所有图像都被html加载，你会得到所有图像的低加载时间吗？如果没有，那么可能是Web服务器问题。