在哔哩哔哩的视频列表页面，需要对视频进行懒加载优化，以提高页面的加载速度。请详细说明实现懒加载的步骤和技术方案。

答题要点

使用 STAR 法则解答。S（情境）：哔哩哔哩视频列表页面视频多，加载慢，需要进行懒加载优化。T（任务）：实现视频懒加载。A（行动）：关键要点如下：1. 标记视频元素：给需要懒加载的视频元素添加特定的属性，如 `data-src` 存储视频的真实地址。2. 监听元素可见性：使用 `Intersection Observer API` 监听视频元素是否进入视口。3. 加载视频：当视频元素进入视口时，将 `data-src` 的值赋给 `src` 属性，实现视频加载。4. 兼容性处理：考虑不支持 `Intersection Observer API` 的浏览器，使用传统的滚动监听方法实现。R（结果）：提高页面加载速度，优化用户体验。示例话术：在哔哩哔哩的视频列表页面，由于视频数量多，加载速度慢，我们的任务是实现视频懒加载。首先给视频元素添加 `data-src` 属性，然后使用 `Intersection Observer API` 监听元素是否进入视口。当元素进入视口时，将 `data-src` 的值赋给 `src` 属性。对于不支持该 API 的浏览器，使用滚动监听方法。这样可以提高页面加载速度，优化用户体验。