One of the biggest challenges with Responsive Web Design is images. Serving as small as possible but as big as necessary images to the right devices, tiny screen featurephones around 128 x 160 at 100 ppi to Retina display Macbooks at 2560 x 1600 at 227 ppi and lots of things between and around the edges.
I was very intrigued by Daan Jobsis's Retina Revolution where he talks about using oversized JPGs at very high compression, and using the browser to scale the size down, using width and height attributes. Scott at Filament Group followed this up a few days ago with his post Compressive Images.
I had some hope that, with some tweaking, this could be used as a good stop gap for the picture element. The memory issues with very large JPGs could be mitigated to some extent by fiddling with the actual size of the image, but Harold Dennison's comment on Scott's post has convinced me that I won't be using this method:
... we are serving a crappy image.
Now when our visitor decides to save the image, or open it on a new window, or anything not involving the CSS scalation, he’s going to get a “double sized-artifacted-blurred” image
For me, this breaks the web a bit. I often save images from the web, often via Evernote, and having this flow broken feels wrong.