Question: Does "will-change: contents" and "will-change: scroll-position" have any effect on blink?

[anat...@gmail.com]

Hi guys, 

I have questions about "will-change" CSS property implementation on blink.

"will-change: transform" is known as way to create a layer to composite on GPU and replace with translateZ() hack.

But does "will-change: contents" and "will-change: scroll-position" have any effect?

I'm writing a book about web performance tuning in Japanese and investigating about "will-change" css property.

But there is no information about "contents" and "scroll-position" implementations on "will-change".

How "will-change: contents" and "will-change: scroll-position" works inside blink?

Developers should use "will-change: contents" or "will-change: scroll-position" for performance tuning? 

Thanks,

[Majid Valipour]

I am pretty sure "will-change:scroll-position" and  "will-change:contents" do not cause a composited layer to be created in Blink. In fact, "will-change: contents" prevents any descendant with compositing will-change hints to create a composited layers.  Here is a simple test page that shows this. You can use devtools to inspect composited layers by enabling "show composited layer borders" in rendering settings. There is also "Layers Panel" in devtools experiments that exposes more detail on these layers.

In case you are interested, this is the function that takes an element's CSS attributes and tries to find a potential reason to create a composited layer for it:

In particular the line you are interested in is: 

if (style.hasWillChangeCompositingHint() && !style.subtreeWillChangeContents())

        reasons |= CompositingReasonWillChangeCompositingHint;

I am not an expert in this area but I couldn't find any optimization for "will-change: scroll-position" in Blink, and the only optimization for "will-change: contents" is that it disables creation of composited layers in its subtree which can be used to avoid paying the compositing cost when the content is expected to change.

Majid

[Ali Juma]

On Mon, Jun 13, 2016 at 10:46 AM Majid Valipour <maj...@chromium.org> wrote:

I am not an expert in this area but I couldn't find any optimization for "will-change: scroll-position" in Blink, and the only optimization for "will-change: contents" is that it disables creation of composited layers in its subtree which can be used to avoid paying the compositing cost when the content is expected to change.

Correct, "will-change: scroll-position" currently has no effect in Blink, and "will-change: contents" prevents the creation of composited layers in its subtree when possible (currently, only compositing for animations is prevented by will-change: contents).

[anat...@gmail.com]

Thank you Majid and Ali. These are great pointers. 

I got that "will-change: contents" prevents layer creation in its subtree and "will-change: scroll-position" has just no effect in Blink.

Your explanation really helped.

2016年6月14日火曜日 18時16分50秒 UTC+9 Ali Juma: