CDK虚拟滚动条的大小

Question

当我将cdk虚拟滚动条的itemSize放低时，我注意到页面的加载时间几乎是该量的两倍。

Company-#companyId和<cdk-virtual-scroll-viewport [itemSize]="45"（具有2k行的表）之间存在很大差异。

我的问题是，为什么页面加载时间从2秒变为近5秒？ 怎么会有这么大的差异？

Answer 1

[itemSize]决定列表中每行的像素高度。

然后，虚拟滚动条使用此滚动条（部分）来确定它可以在视口上方和下方缓冲多少行。您制作的itemSize越矮，它尝试加载和缓冲的内容就越多。

关于

  

为什么页面加载时间从2秒增加到将近5秒？

谁知道；这完全取决于您的实际代码是什么，实例化列表是什么，绑定了什么，什么可能触发RecalcStyle，等等。例如，也许您有一些过程可以迭代O（n ² ）中的列表，或者可能有很多事件侦听器。我们需要更多细节来进行分析。