takes two seconds to render ad header of www.autoblog.com (hardware acceleration, gradients & transparency, oh my!)

RESOLVED WORKSFORME

Status

()

RESOLVED WORKSFORME
7 years ago
6 years ago

People

(Reporter: blizzard, Unassigned)

Tracking

({perf})

Trunk
x86_64
Windows 7
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

(URL)

Attachments

(1 attachment, 1 obsolete attachment)

1. Load the URL: www.autoblog.com/2011/12/06/2013-mazda-cx-5-first-drive-review/
2. Note that it takes a long time to load & render the page
3. If you switch tabs and then back to the page, it can take about 2 seconds to render.
4. If you scroll down on the page and then switch back and forth between tabs it's very fast, so the problem is just the very top ad header

Tested on a Nightly with Windows 7.
(Reporter)

Comment 1

7 years ago
OK, so it's actually an ad header that doesn't always show up.  Trying to capture it.
(Reporter)

Comment 2

7 years ago
Created attachment 579430 [details]
zip file of the page as rendered
(Reporter)

Updated

7 years ago
Summary: takes two seconds to render the header of www.autoblog.com → takes two seconds to render ad header of www.autoblog.com
(Reporter)

Comment 3

7 years ago
The perf problem comes from this style rule on the top of the page:

#ad_banner {
  background-image: -moz-linear-gradient(63deg, #151515 5px, transparent 5px),
                    -moz-linear-gradient(243deg, #151515 5px, transparent 5px),
                    -moz-linear-gradient(63deg, #222222 5px, transparent 5px),
                    -moz-linear-gradient(243deg, #222222 5px, transparent 5px),
                    -moz-linear-gradient(0deg, #1B1B1B 10px, transparent 10px),
                    -moz-linear-gradient(#1D1D1D 25%, #1A1A1A 25%, #1A1A1A 50%, transparent 50%, transparent 75%, #242424 75%, #242424);
}
(Reporter)

Comment 4

7 years ago
Created attachment 579455 [details]
reduced test case
Attachment #579430 - Attachment is obsolete: true
(Reporter)

Comment 5

7 years ago
Looks like the page just uses -moz-linear-gradient with transparency and that is just plain expensive on Windows.  It makes this page super-slow.
(Reporter)

Updated

7 years ago
Keywords: perf
(Reporter)

Comment 6

7 years ago
Note: if I disable hardware acceleration the problem goes away.
(Reporter)

Updated

7 years ago
Summary: takes two seconds to render ad header of www.autoblog.com → takes two seconds to render ad header of www.autoblog.com (hardware acceleration, gradients & transparency, oh my!)
Bas, this sounds like your sort of thing!
(Reporter)

Comment 8

7 years ago
Hi, Bas!  What's up, baby?
This (given URL and Attachment 579455 [details]) is fixed/WFM with Bug 823147 fixed.
Depends on: 823147
Also WFM in today's nightly
Status: NEW → RESOLVED
Last Resolved: 6 years ago
Resolution: --- → WORKSFORME
You need to log in before you can comment on or make changes to this bug.