SOURCE

const observer = new IntersectionObserver(elements => {
  elements.forEach(element => {
    console.log(element.isIntersecting)
    if (element.isIntersecting) {
      element.target.src = element.target.dataset.src
    }
  })
})

const imgList = document.querySelectorAll('img')

imgList.forEach(img => {
  observer.observe(img)
})

<img
  data-src="https://cdn.pixabay.com/photo/2021/08/24/15/38/sand-6570980_960_720.jpg"
  alt="1"
/>
<img
  data-src="https://cdn.pixabay.com/photo/2013/02/21/19/06/drink-84533_960_720.jpg"
  alt="2"
/>
<img
  data-src="https://cdn.pixabay.com/photo/2013/07/18/20/26/sea-164989_960_720.jpg?t=1321"
  alt="4"
/>
<img
  data-src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885_960_720.jpg"
  alt="5"
/>
<img
  data-src="https://cdn.pixabay.com/photo/2017/03/26/21/54/yoga-2176668_960_720.jpg"
  alt="6"
/>

img {
  display: block;
  max-width: 1200px;
  width: 100%;
  height: 600px;
}

img + img {
  margin-top: 20px;
}