What is the best way to preload multiple images in JavaScript?
<p>If I have an array of image filenames,</p>

<pre><code>var preload = ["a.gif", "b.gif", "c.gif"];
</code></pre>

<p>and I want to preload them in a loop, is it necessary to create an image object each time? Will all the methods listed below work? Is one better?</p>

<p>A.</p>

<pre><code>var image = new Image();
for (i = 0; i &lt; preload.length; i++) {
    image.src = preload[i];
}
</code></pre>

<p>B.</p>

<pre><code>var image;
for (i = 0; i &lt; preload.length; i++) {
    image = new Image();
    image.src = preload[i];
}
</code></pre>

<p>C.</p>

<pre><code>var images = [];
for (i = 0; i &lt; preload.length; i++) {
    images[i] = new Image();
    images[i].src = preload[i];
}
</code></pre>

<p>Thanks!</p>
