如何提高页面1000条数据的渲染效率

一般页面1000条数据的正常渲染我们可能用的比较多的是分页，但是在不做分页的前提下怎么实现长列表的渲染效率，就是怎么做到不卡顿？
可能我们会监听高度，滚动条什么的去做滚动分页，我没试过，但是我觉得应该是可以实现的，就跟手机端的上划加载更多一样的处理逻辑吧。

实现机制：

从第10个开始，这些没在可视区的元素就没有被渲染，这可比上面那种全部元素都渲染好太多了，但是如果浏览器不渲染页面内的一些元素，滚动将是一场噩梦，因为无法正确计算页面高度。这是因为，content-visibility会将分配给它的元素的高度（height）视为0，浏览器在渲染之前会将这个元素的高度变为0，从而使我们的页面高度和滚动变得混乱。
具体原因可参照：https://juejin.cn/post/7168629736838463525

实现方案：

.list_item {
  content-visibility: auto;
  contain-intrinsic-size: 200px; // 高度接近真实渲染的值效果会更好，如果实在无法知道准确高度，我们就给一个大概的值，会使滚动条的抖动问题相对减少。
}

如果不加size高度，在滚动过程中，滚动条会抽搐一样的抽抽。高度的值最好更加贴近item的高度，效果更好。