What you're thinking of is probably similar to foundation's interchange http://foundation.zurb.com/docs/components/interchange.html

The images could've been compressed a bit with a tool like https://imageoptim.com/ I'm seeing a little 20% (half a mb) could've been shaved off, but the bigger issue is the 1.7mb medium bundle js file. Not sure what that is, but it isn't minified all the way.

It's coming: http://caniuse.com/#feat=srcset

I think that people are starting to realize that a one-size-fits-all approach to images isn't really feasible anymore. If you serve gigantor images that look good on retina or 4K screens to low res devices, you just wasted a lot of bandwidth and tanked your page load time for no reason. The opposite is also true: 640x480 images don't look super great on 4K screens.

You can resize your images to a few key sizes, but it can quickly get out of hand to support all the various permutations of size and format for every potential user (and who knows if most of these objects will ever even be served).

There are some solutions to the problem out there, such as the one from my employer: http://www.imgix.com/imgix-js

Basically though, to do responsive design with image heavy content, you need to make the images responsive as well.