<!-- BEGIN COPY / PASTE -->
    <!-- Using the native loading attribute -->
    <img src="image.jpg" alt="Description" loading="lazy">

    <!-- Using Intersection Observer API -->
    <script>
      document.addEventListener("DOMContentLoaded", function() {
        const images = document.querySelectorAll('img[data-src]');
        const config = {
          rootMargin: '0px 0px 200px 0px',
          threshold: 0
        };

        let observer = new IntersectionObserver(function(entries, self) {
          entries.forEach(entry => {
            if (entry.isIntersecting) {
              let img = entry.target;
              img.src = img.dataset.src;
              self.unobserve(img);
            }
          });
        }, config);

        images.forEach(image => {
          observer.observe(image);
        });
      });
    </script>
    <!-- END COPY / PASTE -->