GWT & IE8 导致非常滞后的表格行为答案

【问题标题】：GWT & IE8 cause a very laggy table-behaviorGWT & IE8 导致非常滞后的表格行为
【发布时间】：2010-09-20 08:49:36
【问题描述】：

我还有一个问题。我正在使用 GWT 2.0.4 和 IE8 以及 FireFox（后者仅用于比较目的）。我的应用程序需要加载数据并将其显示在表格中。大约有 60 列和 150 行要显示。

由于加载是动态的——一旦数据集被提取，它就会被添加到表中——加载过程中的减速我很好。但是：当表格完全加载时，我希望它会非常活泼，让我滚动它不会有太多延迟。

虽然加载的表格在 FireFox 中的反应非常好 - 它仍然非常灵敏 - Internet Explorer 8 让我很头疼。特别是：一旦表格完成加载并且我尝试滚动或突出显示一行，IE8 就会变得非常迟钝，突出显示一行会使 IE8 消耗 50+% 的 CPU 功率。

我没有使用任何 3rd-party 库，甚至在 FlexTable 中显示空单元格仍然给我同样的问题。

我在这里发现了一些可能相关的问题：SmartGWT ListGrid is slow, but only in Internet Explorer。不幸的是，那里的问题和提供的 SmartGWT 链接都没有解决我的问题，因为我没有使用 SmartGWT。我确实相信这个问题是相关的。

我很乐意尝试任何建议。

【问题讨论】：

标签： gwt internet-explorer-8

【解决方案1】：

如果可能（并且您对问题的描述表明如此），请改用Grid：

一个矩形网格，可以包含 text、html 或其中的子 Widget 它的细胞。 必须调整大小明确到所需的数量行和列。

查看bulk table renderers @@GWT Incubator 以比较这些方法（这有点过时，但FlexTable 比Grid 慢的观点仍然成立；））。孵化器中的“批量渲染”表也是一种选择，但请记住，这些小部件可能不再维护（例如，包含错误） - 或者被快速维护：D 但至少可以查看源代码如果您想推出自己的解决方案来解决此问题，请为您指明正确的方向。

【讨论】：

非常感谢！我已经找到了 BulkTableRenderer，现在我正在搞乱 PaginationScrollTable。这似乎正是我所需要的。它几乎很容易使用，也没有任何琐碎的例子——它们会非常有用，因为使用那个 PaginationScrollTable 非常困难。您必须指定一个 TableModel 和一个 TableDefinition（列）以及覆盖某些抽象方法等......不过非常感谢 :)
如果PaginationScrollTable 引起了您的注意，我会推荐最新的 GWT 2.1 里程碑 - 它应该包含新的数据表示小部件，这些小部件是使用从（现在不受支持和放弃）获得的经验创建的PaginationScrollTable（可能还有孵化器中的其他一些表格）。您可能也很难找到好的文档和示例（不能肯定地说，最近没有检查过），但这是一个比PaginationScrollTable 更“安全”的赌注，恕我直言。
查看Bikeshed，它的起点是samples :)（抱歉重复发帖，但链接使评论过长）

【解决方案2】：

突出显示一行会使 IE8 消耗 50+% 的 CPU 功率。

可能是因为您在表格的每一行都添加了鼠标侦听器。如果是这样，您可以在您的 css 文件中使用 :hover-pseudo-class。

如果您需要处理来自表中的一堆小部件的事件，这篇文章可能会有所帮助：http://code.google.com/intl/en/webtoolkit/doc/latest/FAQ_UI.html#As_the_application_grows,_event_handlers_seem_to_fire_more_slowl

【讨论】：

嘿 :)，我已经检查过了。我在我的 css 中使用 css :hover 伪类而不是使用 JavaScript。但是：问题仍然存在。我认为问题在于 IE javascript 引擎执行 DOM 操作的方式。在纯 HTML 中创建一个巨大的表可以正常工作，但如果使用 JavaScript 创建会导致严重的滞后问题。我将尝试 BulkTableRenderer 和相关的类（请参阅上面的其他答案 :)）。不过感谢您的回复。
:hover 是一个很好的建议，每个人都应该使用它，但是... IE6 doesn't support it for non-links ;_;当然，除非您的目标不包括 IE6，在这种情况下，您是一个快乐的 Web 开发人员并且可以做所有很酷的事情；）