Closed Bug 1533102 Opened 6 years ago Closed 3 years ago

Extra "all black" paint when reloading www.theverge.com (and longer wait time on all-black rendering for normal pageload)

Categories

(Core :: Performance: General, defect, P3)

defect

Tracking

()

RESOLVED WORKSFORME
Tracking Status
firefox67 --- affected

People

(Reporter: bzbarsky, Unassigned)

Details

At least on Mac, with tracking protection off, if I load http://www.theverge.com I see the viewport paint all black, then paint with content.

Other browsers seem to not have this flash of black. See bug 1516552 comment 20.

(In reply to Boris Zbarsky [:bzbarsky, bz on IRC] from comment #0)

At least on Mac, with tracking protection off, if I load http://www.theverge.com I see the viewport paint all black, then paint with content.

Other browsers seem to not have this flash of black. See bug 1516552 comment 20.

FWIW, Chrome on Linux gives me "actual results" (all-black paint, and then paint with content). I just tried 4 times in a row (loading theverge.com in a new tab each time), and I saw that flash-of-black behavior every time.

I also get those same results (flash of black before any content paints) from the following browsers that I tested remotely via BrowserStack.com:

  • Chrome 72 on Win10
  • Edge 18 on Win10
  • Safari 12 on Mac Mojave
  • Chrome 72 on Mac Mojave

So: I have yet to find a browser that has the expected no-flash-of-black behavior. In other words, from my testing, Firefox's behavior is the same as every other browser's.

bz, do you have any ideas for why you might be seeing better results from other browsers than what I'm seeing?

Flags: needinfo?(bzbarsky)

One observation: if I amend the STR to be "reload theverge.com", then I do see better results from Chrome. I see flash-of-black from Firefox pretty much every time, whereas I only see flash-of-black from Chrome in ~2/15 attempts (testing locally).

(Not sure if that's the explanation for the difference between my results & bz's results -- bz, did you mean "reload" rather than "load"?)

So I just tried this again with Chrome (74 dev on Mac Sierra) and a current nightly.

If I do an uncached load (by clearing the cache) I do see a black paint in Chrome; it's there for about 0.3s before content paints. In Firefox, with tracking protection off and cache cleared, it's closer to 0.5-0.6s, I think.

For a cached load, though, I see a ~.3s black paint in Firefox, but in Chrome usually it's not there at all; when present it's much shorter. Just tested Safari TP and it's more like Firefox here.

So yes, I guess the bit I was seeing in bug 1516552 was around reloading.

Flags: needinfo?(bzbarsky)
Summary: Extra "all black" paint on www.theverge.com → Extra "all black" paint when reloading www.theverge.com (and longer wait time on all-black rendering for initial load)
Summary: Extra "all black" paint when reloading www.theverge.com (and longer wait time on all-black rendering for initial load) → Extra "all black" paint when reloading www.theverge.com (and longer wait time on all-black rendering for normal pageload)

I'll move this to Core: Performance until we find the time to do a more thorough investigation which will hopefully point us to a better component.

Component: General → Performance
Priority: -- → P3

Ok, just to restate the problem this bug is tracking: In Firefox with tracking protection off, reloading theverge.com shows black for a longer time than reloading theverge.com in Chrome.
I can confirm that observation on my Mac. The time between pressing Cmd+R and seeing the post-black painted frame on the screen is about twice as long in Firefox as in Chrome. Here's a Firefox profile where it takes 1.7 seconds: https://perfht.ml/34qzCpx. The time range there is from the command event in the parent process that triggers the reload to the composite that puts the post-black content on the screen.

This was fixed a while ago by tracking protection changes; we now stub out a google tag manager script which, because it didn't load, was causing longer blackness. I can't find the bug which made this change at the moment.

Status: NEW → RESOLVED
Closed: 3 years ago
Resolution: --- → WORKSFORME

(In reply to Markus Stange [:mstange] from comment #7)

This was fixed a while ago by tracking protection changes; we now stub out a google tag manager script which, because it didn't load, was causing longer blackness. I can't find the bug which made this change at the moment.

That sounds like bug 1516552. This bug here was about timing differences between Firefox w/ Tracking Protection off vs. other browsers (per comment 0 and comment 6), so I don't think it would have been impacted by stubbing?

(Having said that, I haven't retested and it's possible this is indeed WFM at this point; but I think not-for-the-reason-you-stated in comment 7, unless I'm misunderstanding.)

Flags: needinfo?(mstange.moz)

FWIW retrying my steps from comment 2, this does seem to be WFM.

In particular: with tracking protection off ('custom' and unchecking all checkboxes), and with network traffic throttled (sudo wondershaper [eth-interface-name] 200 200) and then reloading The Verge, I'm not visually seeing any fully-black paints. The header image and most of the content remains in-place as the page reloads and never disappears.

(I'll try bz's steps from comment 3 next...)

(In reply to Boris Zbarsky [:bzbarsky] from comment #3)

If I do an uncached load (by clearing the cache) I do see a black paint in Chrome; it's there for about 0.3s before content paints. In Firefox, with tracking protection off and cache cleared, it's closer to 0.5-0.6s, I think.

I can't reproduce these black paints on first pageload, in either Chrome or Firefox. I'm using sudo wondershaper [eth-interface-name] 1000 1000 (1MB down/up) to make things take a bit longer while still loading in a reasonable amount of time (~10 seconds to first-paint). And I've disabled tracking protection (via 'custom'/unchecking-checkboxes), and clearing cache and then opening a new tab with The Verge.

In both Chrome and Firefox, I see the black-background & page-content paint together atomically in the first paint, as-expected/desired here. This was my observation from several uncached-load attempts. (Before that first paint, the tab is just showing a default browser-theme background-color, which in my case is a grayish color for Chrome and white for Firefox.)

So it seems like WFM is the correct resolution, though possibly not for the reason in comment 7, but rather via other changes on our end and/or The Verge's end.

Thank you, Daniel!

Flags: needinfo?(mstange.moz)
You need to log in before you can comment on or make changes to this bug.