Intent to Ship: Scroll Anchoring

[Steve Kobes]

Contact emails

sko...@chromium.org, yma...@chromium.org, oj...@chromium.org, kenji...@chromium.org

Explainer

https://github.com/skobes/ScrollAnchoring/blob/master/explainer.md

Spec

https://rawgit.com/skobes/ScrollAnchoring/master/spec.html

Tag review

https://github.com/w3ctag/spec-reviews/issues/142

Summary

Changes in DOM elements above the visible region of a scroller can result in the page moving while the user is in the middle of consuming the content.

This spec proposes a mechanism to mitigate this jarring user experience by keeping track of the position of an anchor node and adjusting the scroll offset accordingly.

This spec also proposes an API for web developers to opt-out of this behavior.

Motivation

Reflows from ads or image loads create a jarring user experience.  This is a particular source of frustration on mobile devices with slower network connections and user interest is extremely high: 430 Likes on Addy Osmani's tweet and several articles on the web when the feature landed behind a chrome://flag.

While it is possible for web authors to construct pages that avoid such reflows (the AMP Project is an example of this), it is neither trivial nor always practical (e.g. lack of control on third party code).  Consequently, scroll anchoring is desirable as a user-agent intervention.  Web developers seem to be supportive and we haven’t heard any strong negative feedback so far.

Link to "Intent to Implement" blink-dev discussion

https://groups.google.com/a/chromium.org/d/msg/blink-dev/TbuxbOtyZvk/EwUSJrQ6AQAJ

Is this feature supported on all six Blink platforms (Windows, Mac, Linux, Chrome OS, Android, and Android WebView)?

Yes.

Demo link

This A/B comparison video is an excellent demo for the feature.

Debuggability

N/A: we believe that the latest design of this feature has an extremely low likelihood of breaking content. Launching this feature will help us confirm this view.

Interoperability Risk

Scroll anchoring has been proposed and discussed on WICG interventions.  There was some historical interest from Mozilla.

Compatibility Risk

Moderate.  We have implemented heuristics to avoid known compatibility issues, but it is still possible for a site to be adversely affected, especially if it makes dynamic layout changes in a scroll event handler.

We offer an opt-out mechanism in the form of the css property called "overflow-anchor".  This property can be used to disable scroll anchoring in part or all of a webpage (opt out), or exclude portions of the DOM from the anchor node selection algorithm (learn more).

OWP launch tracking bug

https://crbug.com/594870

Entry on the feature dashboard

https://www.chromestatus.com/features/5700102471548928

[Dimitri Glazkov]

LGTM1.

:DG<

[Chris Harrelson]

This intent adds a new overflow-anchor CSS value, correct? Has that been discussed with the CSS WG? Also, is there any status of the linked spec moving towards standards acceptance?

The link to WICG interventions also is just one bug with very little discussion on it.

Is there additional data indicating significant support from other vendors or standards bodies?

LGTM1.

:DG<

--
You received this message because you are subscribed to the Google Groups "blink-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blink-dev+unsubscribe@chromium.org.

[Steve Kobes]

Correct, this adds "overflow-anchor" as a CSS property.  It was discussed at TPAC (Ojan can provide more details here) and there is a proposal to move the spec into WICG at https://discourse.wicg.io/t/proposal-scroll-anchoring/1752.

[Rick Byers]

Can you please file an issue on the CSS WG repo that suggests CSS should define a property for controlling this and links to your repo as "incubation" for the idea?  If we explicitly ask there if any other implementor is interested in working on this and has any major concerns with the current design, that should give us a better signal on the interop risk.

[Steve Kobes]

Filed https://github.com/w3c/csswg-drafts/issues/676 as requested..

[Philip Jägenstedt]

Have you reached out to other vendors outside of https://github.com/WICG/interventions/issues/2? David Baron seems positive, but an explicit "we're going to ship this, what do you think?" would be nice, if it hasn't already happened.

LGTM1.

:DG<

To unsubscribe from this group and stop receiving emails from it, send an email to blink-dev+...@chromium.org.

[Steve Kobes]

On Thu, Nov 10, 2016 at 6:38 AM, Philip Jägenstedt <foo...@chromium.org> wrote:

Have you reached out to other vendors outside of https://github.com/WICG/interventions/issues/2? David Baron seems positive, but an explicit "we're going to ship this, what do you think?" would be nice, if it hasn't already happened.

We're in the process of doing this.

[Philip Jägenstedt]

To be explicit, would you like to go ahead with shipping this now, or will you get back to this thread when you have some feedback from other vendors?

[Steve Kobes]

We'd like to ship now (hence the intent).  But if the decision of the API owners is that we need more feedback from vendors before shipping, then we'll wait for that.

[Philip Jägenstedt]

No need, I just wasn't sure if you wanted to wait. LGTM2.

[Rick Byers]

+blink-dev again now that some discussion has concluded and we have the required 3 LGTMs.  

LGTM4 FWIW

On Wed, Nov 16, 2016 at 9:50 AM, Ojan Vafai <oj...@chromium.org> wrote:

To be fair, our most recent reaching out was more last minute than I'm happy with. But given that we have some time between now and 56 shipping to stable, there's still a fair amount of time for us to receive feedback before we're locked in.

On Wed, Nov 16, 2016 at 9:31 AM Chris Harrelson <chri...@chromium.org> wrote:

LGTM3 to ship in M56, given that this is a really nice and important feature and we have in fact reached out repeatedly and in multiple ways.

On Mon, Nov 14, 2016 at 5:09 PM, Rick Byers <rby...@chromium.org> wrote:

On Mon, Nov 14, 2016 at 5:08 PM, Rick Byers <rby...@chromium.org> wrote:

We haven't heard any feedback on this API yet and we're nearing the M56 branch point.  I think Ojan and Chris have

Sorry, typo - should be "Steve and Ojan". 

done all the due diligence to ask for feedback in the right places.  I propose that we move ahead with plans to ship in M56.  Chrome 56 is slated to ship by end of January, so we've got about 2 months to either merge tweaks to the API or pull the plug on 56 if there are major concerns.  I don't think we gain much by waiting longer and missing the M56 branch.  Chris, WDYT?

Rick

On Sat, Nov 12, 2016 at 11:05 AM, Rick Byers <rby...@chromium.org> wrote:

Steve has asked for feedback, including filing an issue for CSSWG but we haven't heard anything concrete yet.  In general I don't think we should block shipping waiting for feedback (especially given how excited we know users are to see this improvement).  However it would be much better if we could at least have some "we're interested in exploring this too" signal so that we can move the repo to WICG and continue collaboration in the context of the W3C.

David, based on your comment would you be willing to chime in on the discourse thread about whether or not this proposal should move to WICG?  Separately, if you have time, we'd love to hear (here or on the intent thread) whether the initial proposal seems mature enough as a first start to try shipping in blink?

Thanks,

  Rick

On Fri, Nov 11, 2016 at 11:05 PM, Ojan Vafai <oj...@chromium.org> wrote:

We just have the spec at the wicg. The only real risk is someone objects to the names and values of the CSS property. We are hopeful that the actual anchoring algorithm, which is where most of the complexity is, can still be changed in future versions of Chrome after we have shipped to stable.

We want to aim for m56 (which branched yesterday?), but if we get significant feedback from other browsers that would require not shipping in 56, we can still turn it off on the 56 branch in the coming weeks and ship in 57 instead.

On Fri, Nov 11, 2016, 5:27 PM Chris Harrelson <chri...@chromium.org> wrote:

AIUI this intent requires a CSS change (the "overflow-anchor" property). I can't find any CSS draft spec that includes it.

It appears to only be in the scroll anchoring draft spec. Any other opinions on whether this is problematic?

Chris

--
You received this message because you are subscribed to the Google Groups "blink-dev" group.

To unsubscribe from this group and stop receiving emails from it, send an email to blink-dev+unsubscribe@chromium.org.

--
You received this message because you are subscribed to the Google Groups "blink-api-owners-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blink-api-owners-discuss+unsub...@chromium.org.
To post to this group, send email to blink-api-owners-discuss@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-api-owners-discuss/CAOMQ%2Bw-MLDTo-rp2Rhz9cCCXvyO0W8qzxEmuNPMr%2BPuk7cwbgA%40mail.gmail.com.

--
You received this message because you are subscribed to the Google Groups "blink-api-owners-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blink-api-owners-discuss+unsub...@chromium.org.
To post to this group, send email to blink-api-owners-discuss@chromium.org.

To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-api-owners-discuss/CANMdWTtwJW1BXL_Jopy2-0aQPEstXhAyOi6tfvcAkKgs2bV6TQ%40mail.gmail.com.

--
You received this message because you are subscribed to the Google Groups "blink-api-owners-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blink-api-owners-discuss+unsub...@chromium.org.
To post to this group, send email to blink-api-owners-discuss@chromium.org.

To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-api-owners-discuss/CAFUtAY9-wO0OvksuO7GK9PX-CoyYm_GOZNgHBhxgxzwDXkoaYg%40mail.gmail.com.

--
You received this message because you are subscribed to the Google Groups "blink-api-owners-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blink-api-owners-discuss+unsub...@chromium.org.
To post to this group, send email to blink-api-owners-discuss@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-api-owners-discuss/CAOMQ%2Bw9dFFW5GdqTTnzc-ARW5zjWCdML3A0-Evhyrt02DxVGVA%40mail.gmail.com.

--
You received this message because you are subscribed to the Google Groups "blink-api-owners-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blink-api-owners-discuss+unsub...@chromium.org.
To post to this group, send email to blink-api-owners-discuss@chromium.org.

To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-api-owners-discuss/CANMdWTs5u9YG9Zndncawjct%2BXB8r%3DJn%2BU%3DSTqZwqDNt_9prBXA%40mail.gmail.com.

[Steve Kobes]

Thanks everyone.  We'll proceed with launching in M56.

LGTM4 FWIW

To unsubscribe from this group and stop receiving emails from it, send an email to blink-api-owners-discuss+unsubscr...@chromium.org.

To post to this group, send email to blink-api-owners-discuss@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-api-owners-discuss/CAOMQ%2Bw-MLDTo-rp2Rhz9cCCXvyO0W8qzxEmuNPMr%2BPuk7cwbgA%40mail.gmail.com.

--
You received this message because you are subscribed to the Google Groups "blink-api-owners-discuss" group.

To unsubscribe from this group and stop receiving emails from it, send an email to blink-api-owners-discuss+unsubscr...@chromium.org.

To post to this group, send email to blink-api-owners-discuss@chromium.org.

To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-api-owners-discuss/CANMdWTtwJW1BXL_Jopy2-0aQPEstXhAyOi6tfvcAkKgs2bV6TQ%40mail.gmail.com.

--
You received this message because you are subscribed to the Google Groups "blink-api-owners-discuss" group.

To unsubscribe from this group and stop receiving emails from it, send an email to blink-api-owners-discuss+unsubscr...@chromium.org.

To post to this group, send email to blink-api-owners-discuss@chromium.org.

To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-api-owners-discuss/CAFUtAY9-wO0OvksuO7GK9PX-CoyYm_GOZNgHBhxgxzwDXkoaYg%40mail.gmail.com.

--
You received this message because you are subscribed to the Google Groups "blink-api-owners-discuss" group.

To unsubscribe from this group and stop receiving emails from it, send an email to blink-api-owners-discuss+unsubscr...@chromium.org.

To post to this group, send email to blink-api-owners-discuss@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-api-owners-discuss/CAOMQ%2Bw9dFFW5GdqTTnzc-ARW5zjWCdML3A0-Evhyrt02DxVGVA%40mail.gmail.com.

--
You received this message because you are subscribed to the Google Groups "blink-api-owners-discuss" group.

To unsubscribe from this group and stop receiving emails from it, send an email to blink-api-owners-discuss+unsubscr...@chromium.org.

To post to this group, send email to blink-api-owners-discuss@chromium.org.