Animated background image behind other layers is being needlessly painted/repainted

NEW
Unassigned
(NeedInfo from)

Status

()

3 years ago
22 days ago

People

(Reporter: nissan4321, Unassigned, NeedInfo)

Tracking

({power, testcase})

Trunk
x86_64
Windows 8.1
power, testcase
Points:
---
Dependency tree / graph

Firefox Tracking Flags

(firefox39 affected, firefox41 affected)

Details

(Whiteboard: [Power:P2], URL)

Attachments

(1 attachment)

(Reporter)

Description

3 years ago
User Agent: Mozilla/5.0 (Windows NT 6.3; WOW64; rv:41.0) Gecko/20100101 Firefox/41.0
Build ID: 20150628030215

Steps to reproduce:

1) Enter https://www.microsoft.com
2) Open developer tools and enable the repaint picker.
3) Observe that a small square is being repainted repeatedly in the center of the slide on top of the page, even when the slides aren't changing.


Actual results:

A small square is being repainted repeatedly in the center of the slide on top of the page, even when the slides on the page aren't changing.


Expected results:

There should be only 1 repaint when the slides change.
(Reporter)

Comment 1

3 years ago
repaint picker = "Highlight painted area" button.
OS: Unspecified → Windows 8.1
Hardware: Unspecified → x86_64

Comment 2

3 years ago
This is because the <div class="media"> that is a few levels of DOM up from the actual slide image has this style:

.media {
    background-color: #F0F0F0;
    background-image: url("/CMSImages/progressIndicator40x40.gif?version=22bf30a9-5751-70e3-2c7d-7173410d2ed0");
    background-repeat: no-repeat;
    background-position: center center;
    line-height: 0;
    overflow: hidden;
}

That gif is animated, and keeps being repainted. I don't know why; it's fully occluded by the opaque images above it.

Of course, I don't know how long the MS homepage will look like this, so ideally we should try to have a more permanent testcase...
Status: UNCONFIRMED → NEW
Component: Untriaged → Layout: Images
Ever confirmed: true
Keywords: testcase
Product: Firefox → Core
Summary: A square is being constantly repainted on microsoft.com → Animated background image behind other layers is being needlessly painted/repainted

Comment 3

3 years ago
(Not 100% sure this is the right component, but I expect someone will move further if necessary.)

Comment 4

3 years ago
http://output.jsbin.com/yasecasifa/1

seems like a simple testcase which produces the same issue for me on 39 beta and Nightly.


dholbert/seth, can you comment as to what is going on here and/or move as appropriate?
status-firefox39: --- → affected
status-firefox41: --- → affected
Flags: needinfo?(seth)
Flags: needinfo?(dholbert)
Created attachment 8627316 [details]
reduced testcase 1

Here's a further-reduced testcase, with just an animated background GIF behind an opaque-background div.
This is likely because we build a display item for the hidden image and assign it to a layer before we do occlusion culling. So when we go to invalidate there is retained data and it seems as though the image was visible last paint.

To fix this could could store in the retained data if the visible region of the item was empty after occlusion culling, and skip invalidating if the retained data indicates it wasn't visible last paint.
Flags: needinfo?(dholbert)
(Reporter)

Comment 7

3 years ago
Added the "Power" meta keyword,
as I believe this can affect power consumption on other sites as well.

Feel free to prove me wrong and delete it.
Keywords: power
(Reporter)

Updated

3 years ago
Whiteboard: [Power]
bbirtles says this *might* be covered by bug 1166500.
Depends on: 1166500
Whiteboard: [Power] → [Power:P2]
Depends on: 1237454

Updated

27 days ago
Product: Core → Core Graveyard

Updated

22 days ago
Product: Core Graveyard → Core
You need to log in before you can comment on or make changes to this bug.