Fixed elements repainted on scroll
Reported by
t.kiku...@gmail.com,
Jan 26 2017
|
||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36 Steps to reproduce the problem: 1. Open attached file 2. Enable Paint Flashing in dev tools 3. See fixed sidebar flash when scrolling What is the expected behavior? Sidebar should not get repainted on scroll What went wrong? Fixed elements get repainted on scroll and cause perf issues in more complex cases. Did this work before? N/A Does this work in other browsers? Yes Chrome version: 55.0.2883.87 Channel: n/a OS Version: 6.1 (Windows 7, Windows Server 2008 R2) Flash Version: Shockwave Flash 24.0 r0 It's possible to work around this issue setting transform:translateZ(0) on fixed element to prevent repainting on scroll.
,
Jan 26 2017
Unfortunately this is expected behavior. On low DPI devices we prefer subpixel antialiasing over compositing. What this means is that if we were to promote the fixed position element we would be painting it into a layer with a transparent background so we could no longer draw the text with subpixel antialiasing. On high DPI devices we will promote the fixed position element into a separate layer and not repaint. I have however been actively working towards enabling us to detect opaque fixed position elements which could be promoted and retain subpixel antialiasing - see issue 626200. This means that if your fixed position element had an opaque background (e.g. background: white;) it would be promoted automatically and wouldn't repaint. Developers can of course force the promotion into a layer with any of the styles which trigger this (like a 3d transform, will-change: transform, etc), but the text within will lose subpixel AA.
,
Jan 27 2017
Thanks for a detailed response |
||
►
Sign in to add a comment |
||
Comment 1 by schenney@chromium.org
, Jan 26 2017Components: Blink>Compositing
Status: Available (was: Unconfirmed)