延迟加载（lazy loading）

实现方式：

1. 利用 JavaScript 在页面滚动到需要的位置后再加载对应的内容。例如：

function lazyLoad() {
  const images = document.querySelectorAll('img[data-src]');
  images.forEach((img) => {
    if (img.offsetTop < window.innerHeight + window.pageYOffset) {
      img.src = img.dataset.src;
      img.removeAttribute('data-src');
    }
  });
}

document.addEventListener('scroll', lazyLoad);
window.addEventListener('resize', lazyLoad);
window.addEventListener('orientationChange', lazyLoad);

lazyLoad();

2. 使用像 Intersection Observer 这样的浏览器 API，可以更有效地检测在视图中渲染内容的时间。

const options = {
  root: null,
  rootMargin: '0px',
  threshold: 1.0
};

const observer = new IntersectionObserver((entries, observer) => {
  entries.forEach((entry) => {
    if (entry.isIntersecting) {
      entry.target.src = entry.target.dataset.src;
      observer.unobserve(entry.target);
    }
  });
}, options);

const images = document.querySelectorAll('img[data-src]');
images.forEach((img) => {
  observer.observe(img);
});