You actually can specify which image to upload according to media size. Just keep in mind, the bigger the images are, the longer they take.
There are many methods where we handle the downloading process for better user experience. I believe React.js is one of those tools where they only load the “next image” just like Facebook does when you scroll down, and it loads more.
Anyway as for controlling the sizes of image dependent on the window size:
for example, you can do the following:
<source media="(max-width:600px)" srcset="img/Main500.png">
<source media="(max-width:900px)" srcset="img/Main850.png">
<source media="(max-width:1200px)" srcset="img/Main1076.png">
<img class="img-responsive main-image" src="img/Main2050.png" alt="Big image of lopsided html code">
Check out a discussion about this…