display-locking
display-locking copied to clipboard
Warn when a JS operation like getBoundingClientRect causes a hidden subtree to be 'activated/de-virtualized/rendered'
AIUI from Issue #112, certain calls such as getBoundingClientRect()
may defeat the optimization by causing the subtree to get activated/laid out.
Perhaps it would make sense to suggest implementation give a warning. For will-change
, Firefox's implementation will issue a warning. IIRC it will warn once per page and will ignore if the total will-change surface area is 3x the document viewport to avoid OOM.
I think it would make sense to surface a one-off warning when code is defeating the optimization inadvertently. For instance I'm not sure if querySelecterAll('img')
would defeat the optimization or not.
I don't think Blink or other browsers are likely to be smart enough to know that an 'img' query selector doesn't require style.
Then do operations like querySelecterAll
on ancestors defeat this optimization? Do we have to avoid using them entirely to realize the full win? This could pose large challenges for some code bases that us them a lot. Perhaps this needs a separate discussion: What APIs would become more costly? Is there a strong use case for querying selector only over the active elements.
Sorry I was being dumb somehow. querySelectorAll
does not force style recalc. It only need to look at ids, classes, tag names and attributes.
Therefore querySelectorAll and friends are just fine to call on hidden subtrees.