title: Removing from the DOM an image not yet fully loaded: is transmission aborted?
body: <p>An image (not cached) is added to the DOM; for example (using jQuery):</p>
  
  <pre><code>$('#hereItGoes').append('&lt;img id="theImage" src="image.jpg" /&gt;');
  </code></pre>
  
  <p>The browser starts downloading the resource, it takes some time...</p>
  
  <p><strong>Before the image is fully loaded</strong> some kind of event triggers a callback that removes the image.</p>
  
  <pre><code>$('#theImage').remove();
  </code></pre>
  
  <p>Is the image resource transmission aborted?</p>
  
  <p>More specifically, <strong>does this stop the server from sending (image) data?</strong></p>
  
  <hr>
  
  <p><strong>To give some "context" to the question:</strong></p>
  
  <p><em>a long scrolling page is often designed to lazy-load images: only when images enter the viewport are loaded; as each of them is ready then is faded in and displayed to the user.</em></p>
  
  <p><em>Now what if the user scrolls down the page quickly?</em></p>
  
  <p><em>It may occurr the situation where many images enter the viewport (and start being downloaded) but exit before they're ready.</em></p>
  
  <p><em>Keeping loading would waste bandwidth (and server resources).</em></p>