4

An image (not cached) is added to the DOM; for example (using jQuery):

$('#hereItGoes').append('<img id="theImage" src="image.jpg" />');

The browser starts downloading the resource, it takes some time...

Before the image is fully loaded some kind of event triggers a callback that removes the image.

$('#theImage').remove();

Is the image resource transmission aborted?

More specifically, does this stop the server from sending (image) data?


To give some "context" to the question:

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.

Now what if the user scrolls down the page quickly?

It may occurr the situation where many images enter the viewport (and start being downloaded) but exit before they're ready.

Keeping loading would waste bandwidth (and server resources).

Paolo
  • 13,439
  • 26
  • 59
  • 82
  • 1
    Why not test it? Set up a script on the server that reads an image file, and outputs the data _slowly_ … so that it gives you enough time to remove the image element from the DOM on the client. And then check what the client’s network panel, and your server side logging of the outputting script’s progress tell you. – CBroe Oct 12 '15 at 20:45
  • I'm looking for a *canonical*, possibly cross-browser answer. I'll set up a test if I'll not be totally convinced by the answers. – Paolo Oct 12 '15 at 20:55

1 Answers1

0

No, this is not possible. This is because once you request a resource, it is requested asynchronously by your client-side code so that it won't block the rest of your DOM from loading.

In a more complex server side request, another client-side message can be sent to stop the server from continually processing the data for the response, but in the event that this is sending back an image, there's no point in trying to stop it.

This will have not hurt client-side DOM performance though, since you'll just be ignoring the server response.

David Li
  • 1,122
  • 6
  • 16