The reduced quality images is now live in production. To see it for yourself, compare original http://upload.wikimedia.org/wikipedia/commons/thumb/c/cb/Buildings_of_Bedford_Road_Historic_District%2C_Armonk%2C_NY.jpg/1024px-Buildings_of_Bedford_Road_Historic_District%2C_Armonk%2C_NY.jpg with low quality http://upload.wikimedia.org/wikipedia/commons/thumb/c/cb/Buildings_of_Bedford_Road_Historic_District%2C_Armonk%2C_NY.jpg/qlow-1024px-Buildings_of_Bedford_Road_Historic_District%2C_Armonk%2C_NY.jpg images (253KB => 99.9KB, 60% reduction).
The quality reduction is triggered by adding "qlow-" in front of the file name's pixel size.
Continuing our previous discussion, now we need to figure out how to best use this feature. As covered before, there are two main approaches: * JavaScript rewrite - dynamically change <img> tag based on network/device/user preference conditions. Issues may include multiple downloads of the same image (if the browser starts the download before JS runs), parser cache fragmentation.
* Varnish-based rewrite - varnish decides which image to server under the same URL. This approach requires Varnish to know everything needed to make a decision.
Zero plans to go the first route, but if we make it mobile, or ever site wide, all the better.