Div vs table显示大量数据

Question

我们的软件中有一个自定义查询部分，客户端可以自己设计查询，然后我们将其导出到html表。问题是如果它超过1000行，那么它非常慢，特别是在IE中。查询执行得很快，但渲染需要时间，甚至在我们向下滚动它之后也很慢。我的朋友建议我使用table元素，而不是html div。

任何人都可以在我做大修改之前建议我。

Answer 1

通常情况下，如果使用div而不是表格元素，您将获得性能。这是因为，默认情况下，大多数浏览器使用自动表格布局算法，以便表格及其单元格的宽度取决于其内容。

但是如果你有表格数据，那么语义正确的表示方式就是使用表格。然后，您可以使用table-layout CSS属性更改用于布局表格元素的算法，而不是使用div：

table-layout: fixed

根据https://developer.mozilla.org/en-US/docs/Web/CSS/table-layout，

  

表格布局：已修复

     

表格和列宽由table和col的宽度设置   元素或第一行单元格的宽度。细胞在   后续行不会影响列宽。

     

在“固定”布局方法下，整个表格可以渲染一次   已下载并分析第一个表行。这可以加快速度   “自动”布局方法的渲染时间，但随后   单元格内容可能不适合所提供的列宽。任何细胞   溢出的内容使用overflow属性来确定   是否剪辑溢出内容。