936589 - Transition in thumbnails on TopSites tiles

Status: RESOLVED FIXED

(Firefox for Metro Graveyard :: Firefox Start, defect)

Description

[Sam Foster [:sfoster] (he/him)]

On slower machines/networks, when the TopSites tile thumbnails load there is still a subtle flicker effect as each one is switched in. Maybe fading them in would ease this experience?

Comment 1

[Sam Foster [:sfoster] (he/him)]

Attachment: Fade out default thumbnail when customImage is set

Do either of you have a minute to take a look at this? The idea is to apply the default firefox watermark image to an :after element, which is then transitioned to opacity 0 when customImage is set and the new thumbnail background is applied to the element behind. 
It seems to improve the loading experience a bit for me, but its possible the additional compositing necessary might make things worse on other devices? If you think its a dubious idea or implementation I'm happy to WONTFIX the bug as otherwise I think we've done about all we can on this.

Comment 2

[Rodrigo Silveira [:rsilveira] [:rodms]]

Comment on attachment 829437 [details] [diff] [review]
Fade out default thumbnail when customImage is set

Review of attachment 829437 [details] [diff] [review]:
-----------------------------------------------------------------

I really like the effect. I hope that setting opacity to 0 removes the perf impact of the :after layer.

Comment 3

[Sam Foster [:sfoster] (he/him)]

Comment on attachment 829437 [details] [diff] [review]
Fade out default thumbnail when customImage is set

Making this a review request

Comment 4

[Matt Brubeck (:mbrubeck)]

Comment on attachment 829437 [details] [diff] [review]
Fade out default thumbnail when customImage is set

Review of attachment 829437 [details] [diff] [review]:
-----------------------------------------------------------------

Performs well on my X1 at least.  Sometime soon we should profile the whole about:start load/transition and see what needs optimizing.

Comment 5

[Sam Foster [:sfoster] (he/him)]

On fx-team: https://hg.mozilla.org/integration/fx-team/rev/b49bb9abcb8c

Comment 6

[Matt Brubeck (:mbrubeck)]

https://hg.mozilla.org/mozilla-central/rev/b49bb9abcb8c