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, like carousels, to load as expected when near the viewport instead of the current behavior where these images load when at least one pixel is intersecting the viewport. Blink componentBlink>Image <https://bugs.chromium.org/p/chromium/issues/list?q=component:Blink%3EImage> Motivation Currently the lazy load intersection observer is set up using a rootMargin. This does not work well for pages that use images in CSS scrollers, like carousels, causing the images to load too late, when they become visible and the intersection with the root is detected. To work around this issue some developers are choosing to not use lazy loading, thus increasing the overall bandwidth usage for their sites. This problem was discussed in github issue 431 (https://github.com/w3c/IntersectionObserver/issues/431). Using scrollMargin for the lazy load intersection observer will allow lazy loading images in scrollers to load when they are near the viewport as expected. Initial public proposalNone Search tagslazyload <https://chromestatus.com/features#tags:lazyload>, scrollmargin <https://chromestatus.com/features#tags:scrollmargin> TAG reviewNone TAG review statusNot applicable Risks Interoperability and Compatibility Overall low as scroll margin also applies to the root element thus not affecting lazy loading images that are currently loading with just a root margin. *Gecko*: Positive (https://github.com/w3c/IntersectionObserver/issues/431) https://bugzilla.mozilla.org/show_bug.cgi?id=1864794 *WebKit*: Positive ( https://github.com/w3c/IntersectionObserver/issues/431#issuecomment-930602435 ) https://bugs.webkit.org/show_bug.cgi?id=264864 *Web developers*: Positive ( https://bugs.chromium.org/p/chromium/issues/detail?id=1391989) *Other signals*: WebView application risks Does this intent deprecate or change behavior of existing APIs, such that it has potentially high risk for Android WebView-based applications? None Debuggability None Is this feature fully tested by web-platform-tests <https://chromium.googlesource.com/chromium/src/+/main/docs/testing/web_platform_tests.md> ?Yes https://wpt.fyi/results/html/semantics/embedded-content/the-img-element?label=master&label=experimental&aligned&q=image-loading-lazy-in- Flag name on chrome://flagsLazyLoadScrollMargin Finch feature nameNone Non-finch justification This feature is behind an enabled-by-default flag that can be disabled if needed. Requires code in //chrome?False Tracking bughttps://bugs.chromium.org/p/chromium/issues/detail?id=1391989 Estimated milestones Shipping on desktop 121 DevTrial on desktop 121 Shipping on Android 121 DevTrial on Android 121 Shipping on WebView 121 Link to entry on the Chrome Platform Status https://chromestatus.com/feature/5106926245642240 This intent message was generated by Chrome Platform Status <https://chromestatus.com/>. -- 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+unsubscr...@chromium.org. To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAFxahvtrmHkoOpTuD2eZYVOyFuAhP8ZFVoTuNBS8zYTVY%3DTaaQ%40mail.gmail.com.
