title: memory leak while drawing many new images to canvas
body: <p>I have written a "slide show" that displays images sequentially and quickly, much like a stop-frame movie. </p>
  
  <p>Once an image is displayed, I have no further use for it and would like to clear it from memory to free space for new images. However, while monitoring Google Chrome Helper in Activity Monitor, I see that the memory continues to increase steadily until the browser crashes.</p>
  
  <p>I noticed <a href="https://stackoverflow.com/questions/4903561/chrome-memory-garbage-collection-issue">a chrome garbage collection issue</a> that was submitted as a bug and I'm wondering if maybe I'm experiencing this?</p>
  
  <p>Otherwise, here is one example of a trick I tried based on <a href="https://stackoverflow.com/questions/7544957/memory-leak-in-javascript-when-using-new-image">this post</a> to get Chrome to trash my old image data. </p>
  
  <pre><code>  function ClearChunk()
    {      
          imageSet1 = null; // garbage collect please?
          imageSet1 = [];
    }
  
    function LoadNewChunk()
    {
          for (i=start_of_chunk;i&lt;end_of_chunk;i++)
          {
                imageSet1[i-start_of_chunk] = new Image();
                imageSet1[i-start_of_chunk].src = img[i]; 
          }
    }
  </code></pre>
  
  <p>This clears first and then loads in the background, all while another array of images are being displayed. It seemed like a good idea at the time, but on my machine it still climbs steadily to about 3Gb and... Aw, Snap. </p>
  
  <p>How to mitigate this rampant memory consumption in the first place?</p>
  
  <p>Any conversational or code-based feedback would be appreciated.</p>