Re: [blink-dev] Intent to Ship: Lazy load scroll margin

Thanks for the update Casey! Your understanding of how the change to using scroll-margin instead of root-margin for lazy loaded images is correct. The MRE provided is working as expected. Given that images near the viewport will be loaded, changing the menu implementation seems like the right path

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

Thanks for the feedback Mateusz! Also, I'm not sure how the margin is configured, but in our case only the > next image is loaded. > The margin is configured

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

I'd like to correct my original post. I assumed lazy images did not download until their visibility toggled from hidden to visible. It turns out our implementation actually places those images in a child of a parent with a hidden x-axis overflow. The images are placed outside the parent element

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

On Mon, Dec 11, 2023 at 3:58 AM 'Mateusz Krzeszowiak' via blink-dev < blink-dev@chromium.org> wrote: > Hi all! > > We were considering removing the lazy-loading inside the slider on shop.app > product pages > because > the images a

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

Hi all! We were considering removing the lazy-loading inside the slider on shop.app product pages because the images appeared too late when scrolling, even on fast connections. I tested the new behaviour in Chrome Canary and it

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

Well, that is debatable... Because the image is 0x0 before it is loaded and centered, it is technically not in the viewport, but I am not sure why it would be 0x0. I am changing the original snippet to this (untested, just more like what I have) - That extraneous seems to cause this... I need

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

Thanks for the update! Since this involves a lazy loaded image, and you mentioned this is a reduced test case, I wanted to check if the image is in viewport or out of viewport in your test page? Regards, Traian On Sun, Dec 3, 2023 at 10:01 AM PhistucK wrote: > When trying to generate a reduce

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

When trying to generate a reduced test case, I found the underlying issue that explains the issue I was having - The image is centered and has a container with a fixed width with the image itself having a 100% width. This is just a snippet for illustrating the structure - Issue - the image doe

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

Thank you Chris! On Thu, Nov 30, 2023 at 10:57 AM Chris Harrelson wrote: > LGTM3 > > On Thu, Nov 30, 2023 at 10:54 AM Mike Taylor > wrote: > >> LGTM2 >> On 11/30/23 9:33 AM, Traian Captan wrote: >> >> You're welcome Rick! >> >> >> On Thu, Nov 30, 2023 at 5:33 AM Rick Byers wrote: >> >>> Thank

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

Thank you Mike! On Thu, Nov 30, 2023 at 10:54 AM Mike Taylor wrote: > LGTM2 > On 11/30/23 9:33 AM, Traian Captan wrote: > > You're welcome Rick! > > > On Thu, Nov 30, 2023 at 5:33 AM Rick Byers wrote: > >> Thank you Traian! >> >> On Thu, Nov 30, 2023 at 7:27 PM Traian Captan >> wrote: >> >>> H

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

LGTM3 On Thu, Nov 30, 2023 at 10:54 AM Mike Taylor wrote: > LGTM2 > On 11/30/23 9:33 AM, Traian Captan wrote: > > You're welcome Rick! > > > On Thu, Nov 30, 2023 at 5:33 AM Rick Byers wrote: > >> Thank you Traian! >> >> On Thu, Nov 30, 2023 at 7:27 PM Traian Captan >> wrote: >> >>> Hi Rick, >>

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

LGTM2 On 11/30/23 9:33 AM, Traian Captan wrote: You're welcome Rick! On Thu, Nov 30, 2023 at 5:33 AM Rick Byers wrote: Thank you Traian! On Thu, Nov 30, 2023 at 7:27 PM Traian Captan wrote: Hi Rick, Yes. I uploaded a CL that increases the spacer size by 30px:

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

You're welcome Rick! On Thu, Nov 30, 2023 at 5:33 AM Rick Byers wrote: > Thank you Traian! > > On Thu, Nov 30, 2023 at 7:27 PM Traian Captan > wrote: > >> Hi Rick, >> >> Yes. I uploaded a CL that increases the spacer size by 30px: >> https://chromium-review.googlesource.com/c/chromium/src/+/50

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

Will do. Would you mind sharing an example of the case you encountered so that I can test it locally? On Thu, Nov 30, 2023 at 2:34 AM PhistucK wrote: > I hit a case where even when 5 - 10 pixels of the image is in the > scrolling viewport, it is still not loaded, so hopefully it will take care

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

Thank you Traian! On Thu, Nov 30, 2023 at 7:27 PM Traian Captan wrote: > Hi Rick, > > Yes. I uploaded a CL that increases the spacer size by 30px: > https://chromium-review.googlesource.com/c/chromium/src/+/5075126 > > The tests are now failing as expected on Safari: > > https://wpt.fyi/results/

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

I hit a case where even when 5 - 10 pixels of the image is in the scrolling viewport, it is still not loaded, so hopefully it will take care of it as well. Let me know when this is in canary and I can try and test it out (at the moment I am not using lazy loading as a result). :) ☆*PhistucK* On

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

Hi Rick, Yes. I uploaded a CL that increases the spacer size by 30px: https://chromium-review.googlesource.com/c/chromium/src/+/5075126 The tests are now failing as expected on Safari: https://wpt.fyi/results/html/semantics/embedded-content/the-img-element?label=pr_head&max-count=1&pr=43446 On

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

Interesting. Could you try to improve the tests to capture the interop difference and ensure passing reflects full conformance to the spec? We rely on WPTs as our quantifiable measure of interoperability... Rick On Thu, Nov 30, 2023 at 5:07 PM Traian Captan wrote: > Thank you Rick! > > I did so

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

Thank you Rick! I did some investigating into why WebKit is passing some of the new WPTs for lazy loaded images. I think it might be because WebKit is considering the edge as inclusive, while Blink and Gecko do not. In the following example if the spacer height is 100px Safari will report intersec

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

> > > Thanks, that sounds like a strict improvement. > Yes. ExplainerNone >>> > A short (inline) explainer would help reviewers to understand e.g. if this > involves changes to the API surface that developers need to care about. > Can you write a few words on the impact on developers? > Here'

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

On Wed, Nov 22, 2023 at 2:37 PM Yoav Weiss wrote: > Thanks, that sounds like a strict improvement. > > On Wed, Nov 22, 2023 at 6:25 AM Traian Captan > wrote: > >> Yes, that's correct. >> >> >> On Tue, Nov 21, 2023 at 9:18 PM Yoav Weiss >> wrote: >> >>> Do I understand correctly that currently l

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

Thanks, that sounds like a strict improvement. On Wed, Nov 22, 2023 at 6:25 AM Traian Captan wrote: > Yes, that's correct. > > > On Tue, Nov 21, 2023 at 9:18 PM Yoav Weiss wrote: > >> Do I understand correctly that currently lazy-loaded images in CSS >> scrollers have suboptimal behavior and th

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

Yes, that's correct. On Tue, Nov 21, 2023 at 9:18 PM Yoav Weiss wrote: > Do I understand correctly that currently lazy-loaded images in CSS > scrollers have suboptimal behavior and this would improve that without > potentially harming other cases? > > On Wed, Nov 22, 2023 at 1:55 AM Traian Capt

Re: [blink-dev] Intent to Ship: Lazy load scroll margin

Do I understand correctly that currently lazy-loaded images in CSS scrollers have suboptimal behavior and this would improve that without potentially harming other cases? On Wed, Nov 22, 2023 at 1:55 AM Traian Captan wrote: > Contact emailstcap...@chromium.org > > ExplainerNone > > Specification

[blink-dev] Intent to Ship: Lazy load scroll margin

Contact emailstcap...@chromium.org ExplainerNone Specificationhttps://html.spec.whatwg.org/#lazy-load-root-margin Summary Changes the lazy load intersection observer's init dictionary to use a scrollMargin instead of a rootMargin. This allows lazy loading images contained inside CSS scrollers,