Kevin Powell's Introduction to the Intersection Observer JavaScript API

Wed, Jun 19, 2019

Read in 1 minutes

The Intersection Observer API allows you to configure a callback that is called whenever one item, called a target, intersects either the device viewport or a specified element.

Kevin Powell's Introduction to the Intersection Observer JavaScript API

I’ve been watching Kevin Powell’s video introducing the Intersection Observer Javascript API.

Like most web technologies, if overused this could easily become a mess. However, the is also a significant amount of potential. Used sparingly, this could easily direct a users attention by applying minimal amounts of movement to a design element like an image as the user scroll. However, I believe a better use case would be to lazy load large amounts of data. Instead of paging, as a user scrolls down a listing, the application could detect the user nearing the end of the currently loaded dataset and preemptively download more results.

There appears to be some good support for the API too.

For more information, check out the MDN web doc or view Kevin’s video.