Fwd: Proposal for "overflow:clip" for stronger painting isolation

I've been talking with out layout/compositor people here on Blink for
a while now, and one of the things that has shaken out as a big helper
in getting things to work *fast* is having strong, guaranteed methods
to isolate parts of the page.

In particular, isolating the painting of an element seems like a big
win - having some way to guarantee that the element can be
hard-clipped to its boundary without losing anything important.
overflow:hidden doesn't *quite* do this - abspos and fixpos elements
can escape the bounds of the element.

As well, overflow:hidden still allows scrolling into the hidden area,
through JS.  This isn't an edge-case - this technique is used by a lot
of JS libraries.  This means that we can't depend on the element only
painting its visible area - we have to speculatively paint further, so
we can scroll smoothly at a moment's notice.

To get around both of these issues and provide stronger optimization
guarantees to the browser, I suggest we add a "clip" or "contained"
value to overflow.  This does a strong clipping - nothing inside the
element can paint outside the element's rect.

It also acts as a positioning root for abspos inside the element, and
kills fixpos, reverting it to abspos with the element as its
positioning root.

The value also completely prevents scrolling - the scrollWidth/Height
of the element is its visible width/height.

Thoughts?

~TJ

Received on Friday, 20 September 2013 19:04:34 UTC