怎么用空白DIV填充的方法解决列表数据过多的问题？

Question

用vue做列表页面时发现一个问题：一条数据独占一行，一个屏幕能放十条左右的数据，滚动条滚动到底时加载新的数据。但是数据量特别大的时候，可能是几万条，那么HTML里就会存在很多的DOM节点，这个时候我想用空白的DIV来替代不在屏幕内的数据列表，比如说只在HTML中只显示3个屏幕内能放下的数据节点，其余的数据用两个DIV来填充，当滚动条滚到一个屏幕的高度时，替换展示的数据（VUE中用一个数组控制展示的数据），然后再计算上下两个DIV的高度，求实现方法。

Answer 1

我理解题主的思路，是纯前端的优化，控制页面元素的数量，是有意义的。并不是所有的场景都适合做分页，现在有很多列表是滚动加载的，越滚数据越多。。至于实现，感觉题主说的已经比较清晰了。。根据高度计算应该显示的行就 ok 了，但我感觉上下空白的 div 不是很必要