title: many canvas objects result in "InvalidStateError: An attempt was made to use an object that is not, or is no longer, usable"
body: <p>Trying to manage 10.000 simple shapes on a <code>&lt;canvas&gt;</code>, I experimented with caching as a replacement for redrawing. Much to my surprise: </p>
  
  <ul>
  <li>Using <code>ImageData</code> and <code>canvas.{get|put}Image</code> seems terribly slow. </li>
  <li>Caching patterns with <code>canvas.createPattern</code> is nearly as quick as redrawing. </li>
  <li>Caching an entire canvas for each shape is even quicker than redrawing.</li>
  </ul>
  
  <p>For some reason, however, some canvases break during caching. After some lookups, at irregular intervals (every 2-5 cache lookups), a canvas is retrieved that causes an</p>
  
  <pre><code>InvalidStateError: An attempt was made to use an object that is not, or is no longer, usable
  </code></pre>
  
  <p>to be thrown. I am using the same code for caching the different objects, so I think the problem is not the caching, but rather the number of <code>canvas</code> objects. </p>
  
  <p>Maybe it is also of interest that I am animating the shapes to (0,0), reducing their size as well to nothing. Errors do happen even when the rectangle is 6x3px big, for example, so it should not be about sizing. </p>
  
  <p>Any idea? If no immediate idea comes up, I'll simplify the code for posting. Thanks, nobi</p>