10LOC

#intersection-observer

Web Platformintermediate

IntersectionObserver for lazy-loaded images in 10 lines

const observer = new IntersectionObserver((entries, obs) => {
  for (const entry of entries) {
    if (!entry.isIntersecting) continue;
    const img = entry.target as HTMLImageElement;
    img.src = img.dataset.src ?? "";

Load images only when they're about to enter the viewport, using one shared observer instead of a scroll listener per image.