如何只渲染滚动列表可视部分的dom呢 一个100行的例子告诉你

#1

一个只渲染可视部分Dom的小例子,只有100行左右的代码哦

当一个可滚动的div中有很多item的时候,item都会在Dom中显示。

如果有成千上万个item,滚动的时候就会变得没有效率。

这个例子中我们只渲染可视部分的item以及上下一定范围内的item,其他部分用空白的可变高度的div来填充。

整个例子只有100行左右的代码,很适合学习。

#2

已star,很不错。
已follow,欢迎互现star。

#3

看了源码,在不已知各个item的高度,或者只能知道item的最小高度,能否利用你这种方式改进呐。

比如说,滚动过的item才去记录它的真实高度(替换掉最小高度,更新滚动条),只要误差还能处于接受的范围应该就还好。