DOM Observer APIs Quiz (IntersectionObserver, MutationObserver)
Use the three DOM observer APIs the browser ships for free: IntersectionObserver for visibility, MutationObserver for DOM diffs, and ResizeObserver for layout changes.
Question Bank
Hard
JavaScript
quiz
js-web-apis
js-dom
performance-optimization
517 views
13
Use IntersectionObserver to lazy-load img.lazy-load elements: when one scrolls into view, swap data-src into src and stop observing it.
Examples
Example 1:
Input: image enters viewport with rootMargin '50px 0px'
Output: img.src = img.dataset.src; observer.unobserve(img)
Explanation: IntersectionObserver fires a callback when an element crosses its threshold; unobserving avoids future churn.3 more questions, with full solutions and explanations, are available for premium members.
Upgrade to Premium