Why do browsers inefficiently make 2 requests here?

Question

I noticed something odd regarding ajax and image loading. Suppose you have an image on the page, and ajax requests the same image - one would guess that ajax requests would hit

Answer 1

The browser will make the 2 requests on the page, cause an image called from the css uses a get request (not ajax) too before rendering the entire page.

The window load is similar to de attribute, and is loading before the rest of the page, then, the image from the Ajax will be requested first than the image on the div, processed during the page load.

If u would like to load a image after the entire page is loaded, u should use the document.ready() instead