Clone AppendTo function in loop overloads requests to server - should load from cache instead! (Jquery)

This function clones sound objects for a list of images.

The problem is that when the object is written in the DOM, the browser querys the server loads it as a 200 request. However, it is only loading 4 different sound files, over and over again. So it should load as a 304 request from the browser's cache.

All of the sound files are initially loaded in HTML and then cloned. Whenever the page is refreshed the sound files in the HTML receive 304 requests and are loaded from cache, but any file that is cloned is loaded with 200 request (not from cache)!

It there anyway for me to clone these objects without the browser sending a request to the server to load into DOM? Just totally on client side? The data is already written once in the HTML.

I would prefer not to send any requests to the server at all to clone these objects. Sin开发者_如何学Pythonce it clones over 50, that's 50 requests being sent to the server in a second. Overloading it.

var increment = 0;
$("img").each(function(i) { //loop for each item
    if (increment > 4){
        increment = 0;  
    }

    if (i != 0) {  //only clone if there are more than one 'img' items      
        $("#hover-" + increment)  //item to clone     
          .clone(true)
          .attr("id", "beep-" + i)  //new name of object
          .appendTo($(this).parent()); 
    }

    $(this).data("instance", i);  //save the integer for loop
    increment=Math.floor(Math.random()*3);  //change increment
})

---

Each image/sound file reference will resolve in a request to the server unless the image is cached in the browser. You can set "Expires" & "Cache-Control" headers of your image to force caching. These headers are sent from the server when you image is requested.

Another option is to cache the image server side using something like Memcache. This way each image reference will still resolve to the server, but the image will be cached server side for faster access.

For more info see- Kinds of Caches, How Web Caches Work, How (and how not) to Control Caches http://www.mnot.net/cache_docs/