1

在我的项目中,我有一页上有一个包含 24*6*300 单元格的表格(它是用于呈现统计信息的脚本)- 24 列数小时 * 6 列数 10 分钟 * 300 行。每个单元格都有带有附加信息的提示弹出窗口。问题是,它非常非常慢。不仅是渲染,还有页面的整体工作。如果我想加快速度,你有什么建议?(用 div 替换单元格?用 ul?将表格渲染为图像并使用 imagemap 实现悬停效果?)

4

4 回答 4

2

这是我的建议:

1. 分页和/或消除杂乱

也许每页只能显示一小时的数据?也许您可以简化并仅在屏幕上显示基本信息,并在用户特别要求时提供更全面的结果?

2. 移除 CSS3 样式

文本阴影、变换等占用大量 CPU。如果它们对性能有重要影响,请删除它们。在我看来,一个更好的页面是快速而丑陋的页面,而不是漂亮且非常slllllooooooowwwww的页面......

3.页面上的JavaScript??

查明泄漏、优化、重构。

嗯……还有什么?

于 2012-04-05T12:49:39.523 回答
2

我希望您没有在浏览器可见区域中显示 43200 个对象考虑在用户滚动事件上添加行并删除当前不在可见区域中的行。

于 2012-04-05T12:50:09.500 回答
0

您可以使用jqGrid以一种奇特的方式呈现巨大的数据表

于 2012-04-05T12:58:55.367 回答
0

您似乎担心特定的 DOM 元素会占用更多内存/处理器。在您的情况下,您可能会通过使用表格而不是 div 来获得一个或两个额外的元素,这可能是真的。但是要在功能上和视觉上得到相同的东西,你最终会陷入一团糟,很快就会变得无法维护。你需要一堆乱七八糟的 CSS 和一些 JavaScript 才能让它工作。更不用说在语义上它是没有意义的。表格用于表格数据,就像您拥有的一样。

现在你可以疯狂地尝试从头开始编码,或者你可以使用众多工具中的一种来完成工作。我建议利用其他人的辛勤工作并使用免费提供的工具。考虑使用数据表。您可能需要某种分页或“无限滚动”/延迟加载解决方案。数据表带有一个额外的称为“滚动器”,可以为您处理无限滚动。

祝你好运。

于 2012-04-05T13:22:07.540 回答