为啥要有虚拟滚动
首先需要了解的一个概念是DOM：
丢个文档自己去看，不是本文的重点：Document Object Model (DOM) - Web APIs - MDN - Mozilla
其次就是，我们需要知道为什么我们要避免DOM 规模过大| Lighthouse。
这主要是因为以下几点：
- 对渲染性能的影响：
- 重排重绘增加：每当页面上的元素发生尺寸、位置等变化时，浏览器都需要重新计算布局（重排）和重新绘制界面（重绘）。
- 高内存占用：更多的DOM节点意味着需要更多的内存来存储节点信息、样式和布局数据，这会增加浏览器的负担，尤其是在低端设备上。
- 对JS执行效率的影响：
- DOM遍历与操作耗时：
遍历、查询或修改大量的DOM节点会变得非常缓慢，例如使用document.querySelectorAll()查找元素。 - 事件处理器开销：
如果为大量DOM节点绑定了事件处理器，会增加内存开销，并且在事件冒泡时也会拖慢性能。