HTML中的元素太多是否会影响页面性能？

我想知道两者之间是否有区别 1.）10000个表格行，可见 2.）10000使用显示隐藏的tablerow：无

我想知道的是。如果页面上所有10000行都可见，是否会导致页面滚动延迟

---

但是如果我把9000个藏起来。这能减少滞后吗？谢谢各位

一般

显示：无将为浏览器节省一些工作

浏览器将首先解析HTML并构建所谓的DOM（文档对象模型），当收到所有CSS时，它将继续构建CSSOM（CSS对象模型）。这两个元素组合在一起将生成渲染树

有了渲染树，浏览器将执行布局步骤（决定每个元素在屏幕上的位置和大小），然后在屏幕上绘制页面

但是，当将DOM和CSSOM组合成渲染树时，浏览器将丢弃
display:none刚刚遇到这个问题，想把我的2美分也放进去


尽管现代浏览器在快速渲染和
机器速度越来越快，但最好的做法仍然存在
呈现太多的表行。使用分页
这还取决于如何呈现表行。如果您正在使用JS
渲染它，它肯定会对滚动产生负面影响
演出有非常好的js模板解决方案，你可以
最小化js执行开销。叫我老派，但我更喜欢用
客户端上的js呈现更少
好问题！它不太宽泛，讨论得不够。
我正在研究这个问题，我正在考虑一个懒惰的加载问题，并参考其他网站，如推特和ReDIT feed。
Lighthouse用DOM树标记页面，这些树：


总共有1500多个节点
深度大于32个节点
具有一个包含60多个子节点的父节点

例如，我看到Reddit的得分很低26

“避免过大的DOM大小1456个元素”是一项建议操作

Reddit.com：灯塔说：

一个大的DOM会增加内存使用，导致更长的样式
计算，并产生昂贵的布局回流。了解更多。反应
考虑使用“窗口”库，如<代码>反应窗口< /代码>以最小化。
如果要渲染多个重复对象，则创建的DOM节点数
页面上的元素。了解更多。另外，尽量减少不必要的重新渲染
使用shouldComponentUpdate、PureComponent或React.memo和skip
如果使用，则仅在某些依赖项发生更改之前生效
使用效果挂钩可以提高运行时性能

不是答案，而是观察结果，如果您需要同时加载10000行，那么您可能做错了。您可能应该进行某种形式的分页。正如卢克所说，你可能做错了。你也应该能够自己轻松地测试这一点，因为如果你知道如何制作一行，那么你可以用for循环制作10000行。没有足够的信息来回答您的问题。这是一个简单的3列表格，每个单元格中有大约5位数字，那么答案是，除了使用PC时的初始加载之外，它没有任何区别。另一方面，如果表格是40列宽的，每个单元格都有唯一的JavaScript代码来生成每个单元格的图形内容，我想它可以通过隐藏大部分单元格来改进滚动。还有，你做了什么来找出答案，这样别人就不会浪费时间了？