This is news to me. As far as my knowledge takes me, modern browsers will always render at "best", with options to downgrade to "crisp-edges" and "pixelated", which may render faster, but cause lower quality. Image-rendering CSS overview:
https://developer.mozilla.org/en-US/doc ... -rendering
According to the docs above, the best options for "quality" are "smooth" and "high-quality" (although both experimental). In my browser, there is definitely no difference between "auto" (default) and "-webkit-optimize-contrast":
According to the below link, -webkit-optimize-contrast is the same as setting "pixelated", which is generally lower quality scaling, at least for photographic images:
https://css-tricks.com/almanac/properti ... rendering/
I tried in browser, and I see no evidence from testing or from searching other topics, that the option you suggest provides "better" quality for photographic images. This would not be logical either, as modern browser would already optimize images for quality automatically. Why shouldn't they?
In the link below that I found on search, it showcases the effects of -webkit-optimize-contrast, which is definitely the same as "optimizespeed" (not quality) and "pixelated" (not best bicubic scaling). As you can see, when an image is scaled UP, it retains it's pure pixelation.
http://phrogz.net/tmp/canvas_image_zoom.html
I did some tests in my own browser. Setting -webkit-optimize-contrast had no effect, while image-rendering: pixelated created a sharper, but more pixelated image. Some (photo owners) might argue their scaled down photos look better, but this is not what browsers think. It uses bicubic (advanced scaling) by default to create, what the browser believes, is the best quality resize.
Considering the above, I see no reason this should be considered "better quality". Perhaps in the case of scaled graphic-style images like logos and graphics? Yes maybe. It's not something I would consider applying by default.