1185809 - "image.high_quality_downscaling.enabled;true" Image flashes

Status: RESOLVED INVALID

(Core :: Graphics: ImageLib, defect)

Description

[nsuafers]

Attachment: 1.jpg

User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; rv:11.0) like Gecko

Steps to reproduce:

There is problem with new settings "image.decode-immediately.enabled;true" and "image.high_quality_downscaling.enabled;true". Image flashes as you scroll into view.

Disable smooth scrolling, then scroll down this page
http://www.huffingtonpost.com/2015/07/11/astronomy-photos-best-2015_n_7757110.html




Actual results:

I attached pictures to show what happens.
When you scroll down the photo on webpage will look like 1.jpg and then immediately flash and change to look like 2.jpg. 


Expected results:

Now set 
"image.high_quality_downscaling.enabled;false"
When you scroll down the photo on webpage will look like 1.jpg and stay looking like 1.jpg. The image will not flash.

It seems like "image.high_quality_downscaling.enabled;true" is not adhering to "image.decode-immediately.enabled;true"

Comment 1

[nsuafers]

Attachment: 2.jpg

Comment 2

[Seth Fowler [:seth] [:s2h]]

Unfortunately there's not much we can do here. If we decode images as soon as the bytes come in from the network, we don't have enough information about their context on the page to know what size we'll draw them at. That means that we can only decode them at full size.

In 1.jpg, you're seeing the image being scaled down using "normal" scaling - this may be GPU scaling, depending on your platform.

In 2.jpg, you're seeing the same image scaled down using high-quality scaling. To do that kind of scaling, we need to know exactly how large the image will appear on the page, which means we need to wait for other resources to load - HTML, CSS, other images, etc. When we have enough information to know the size, we start a high-quality scaling thread in the background that generates a high-quality downscaled version of the image at that size. When the background thread finishes, we replace the normally scaled version of the image with the high-quality scaled version, and you see 2.jpg.

We're working on smarter prediction of the size of images on a page, which will let us start that high-quality scaling background thread sooner, often before the image appears on the screen. So as time goes on, it will become harder to notice the effect you're seeing here. We'll never be able to truly "decode immediately" to a perfect high-quality scaled version of the image, though - that's just not possible, because until other resources load we don't have enough information to do that.

As an aside, newer versions of Firefox decode images much faster on many machines, reducing or eliminating the need for "image.decode-immediately.enabled". When you start using Firefox 41, try turning it off and see if you're happy with the results.

I'm resolving this as "INVALID" because it's not technically possible to perform a high-quality scale when the image is downloaded, but as I mentioned, we are continuously working to make this effect less noticeable. Some of that work is happening in bug 1151373, and some has already landed in upcoming releases of Firefox in bug 1151359 .