cdk 虚拟滚动的项目大小

斯沃克斯

我注意到当我将 cdk 虚拟滚动的 itemSize 设置为较低的值时,页面的加载时间几乎是两倍。

<cdk-virtual-scroll-viewport [itemSize]="45"<cdk-virtual-scroll-viewport [itemSize]="20"(一个有 2k 行的表)之间有很大的不同

我的问题是为什么页面的加载从 2 秒到将近 5 秒?怎么会有这么大的不同?

姆桑福德

[itemSize] 指示列表中每行的像素高度。

然后虚拟滚动条使用它(部分)来确定它可以在视口上方和下方缓冲多少行。你做的itemSize越低,它就越会尝试加载和缓冲。

至于

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

谁知道; 这完全取决于您的实际代码是什么,列表正在实例化什么,绑定什么,什么可能触发 RecalcStyle,等等。例如,也许您有一些以 O(n 2 )迭代您的列表的过程,或者也许有一堆事件侦听器。我们需要更多细节来分析。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

通过Angular Material拖放+ cdk虚拟滚动,previousIndex意外跳转

来自分类Dev

Angular CDK虚拟滚动无法一次选择matselect中的所有列

来自分类Dev

以编程方式自动滚动多个虚拟视口– Angular Material CDK

来自分类Dev

现有项目的AWS CDK Init

来自分类Dev

角度CDK-滚动时叠加到目标

来自分类Dev

使用AWS CDK创建用于构建Docker映像的CodeBuild项目

来自分类Dev

在哪里可以在AWS CDK中指定codebuild项目属性?

来自分类Dev

使用cdk-virtual-scroll(角度8)滚动到底部

来自分类Dev

StaggeredGridView在滚动上更改项目大小

来自分类Dev

AWS CDK:按CDK顺序运行外部构建命令?

来自分类Dev

在AWS CDK中请求验证

来自分类Dev

CDK中的SQS接口端点

来自分类Dev

在AWS CDK中请求验证

来自分类Dev

具有可变项目大小的ListView回收虚拟化性能

来自分类Dev

Angular 7-虚拟滚动条在滚动时重置多选中的所选项目

来自分类Dev

未安装cdk时如何使用上下文参数执行cdk命令,即使用npm run cdk?

来自分类Dev

AWS CDK-停止生成策略

来自分类Dev

AWS-CDK和Powershell Lambda

来自分类Dev

如何使用@ angular / cdk使NgbModal可拖动

来自分类Dev

使用AWS CDK配置Lambda Warmer

来自分类Dev

使用aws-cdk进行本地开发

来自分类Dev

AWS CDK Python(未找到凭证)

来自分类Dev

无法在AWS CDK中导入VPC

来自分类Dev

使用cdk / ComponentPortal动态添加组件

来自分类Dev

ALB触发Lamda函数缺少权限CDK

来自分类Dev

使用LambdaIntegration时,CDK覆盖绑定

来自分类Dev

AWS CDK授予对堆栈外部资源的权限

来自分类Dev

如何根据情况禁用CDK Drop

来自分类Dev

角度CDK拖放:嵌套的下拉列表