GWT FlexTable性能和优化

我正在从事GWT项目，我们用它来显示一些数据。我知道我们应该使用FlexTable，因为它有更好的性能，但是FlexTable更容易设置样式（特定于样式的单元格），并且更容易更新特定的单元格

要接收表的更新，我们使用WebSocket。我们现在面临的问题是，当每秒有100多个更新通过WebSocket时，CPU负载很高。来自WebSocket连接的每条消息都包含表中几个单元格的更新。因此，实际上每秒有100多个更新应该在FlexTable中呈现。我的3GHz i5和4GB RAM上的CPU负载约为50%。若我禁用数据的实际呈现（comment out setText（）方法调用），那个么CPU负载将下降到5-10%。所以我知道DOM更新是瓶颈，而不是代码的其他部分

这样会更好吗

改用网格

切换到CellTable（但如何进行单个单元格更新）

使用JS/JSNI处理DOM而不是FlexTable setText（）

是否有更好的方法来实现表并提高性能

我试着用谷歌搜索是否有人对FlexTable有类似的问题，但只发现一般的看法是它太慢了，没有什么特别之处。我们的应用程序原型完全用JavaScript完成，同样每秒更新100次，CPU负载约为15%

更新
去掉css淡入淡出效果（我们用来表示单元值的变化）可以减少约10%的CPU负载。因此，DOM似乎不是唯一的问题。

作为上述所有问题的替代方案（或补充，取决于您得到的结果），我将研究使用一些调度程序方法。特别是Scheduler.get（）.scheduleIncremental（）和批量更新，例如一次更新10次。这将允许浏览器在更新之间处理其他事件，并对CPU使用率产生积极影响

---

CellTable在这里对您毫无帮助，因为您无法更新单个单元格。因此，作为一种替代方法，它只剩下网格和手动管理TableElement。

对于CellTable，您必须重新呈现整个表格以更新单个单元格。但是，这样的更新将是对DOM的单个更新。使用FlexTable，即使您将所有更新批处理在一起，也将执行一系列单独的DOM操作。因此，即使由于冗余地更新某些单元格而使用CellTable似乎效率低下，但切换还是值得的。特别是在更新的单元格数量接近总单元格数量的情况下：一起批处理100个更新，并在一次DOM写入中一次完成所有更新

我有一个应用程序，它有一个可大到30x100的CellTable。它在任意单元格上具有任意样式，每个单元格都有复杂的内容（一个

，一些

和一些文本），有时我需要更新单个单元格。在开发模式下，在我的MacBookPro上重新绘制整个过程是不可察觉的（对我的人类感知）

---

如果您想要实时更新（例如，每秒100次更新，如果发生的话），那么我认为您可能需要一个不同的平台。即使您的显示器每秒刷新100次也不行。

您可以使用

cellTable.redrawRow（index）在大桌子上哪个更快。

好的是行索引是由
字段更新程序给出的
单元格的实际更新是在SchedulerImpl.get（）.schedulederferred（）内完成的，但这没有多大帮助。尽管它使浏览器更具响应性。使用SchedulerImpl.get（）.scheduleIncremental（）将不起作用，因为我们获得的数据量可能会有所不同。到目前为止，我们似乎应该尝试使用网格或自己实现表。到目前为止，在这种情况下，增量要比延迟好得多。延迟将在每个操作中使用新的js计时器，而增量将在单个js执行堆栈中批处理多个更新，导致单页重画，从而允许呈现线程也批处理操作。在某些情况下，表中可能有100行8列。其中6列使用WebSocket提要中的数据更新。在我们的模拟中，我们每10毫秒生成一条消息，总共每秒生成100条消息，600次DOM更新。这对于FlexTable来说太难处理了。但很容易注意到数据更新很快，因为数据在不同的位置（单元格）更新。一种最小化它的方法是使用JSNI并用一次DOM更新替换整行。但我不确定在代码从Java编译成JavaScript之后GWT不会做其他事情。你是说你想要一种100hz的闪光效果，在不同的时间在不同的地方进行更新？在这种情况下，我认为任何
结构都是不合适的-更新太多了。画布元素或Flash呢？如果您不需要闪烁，只想一次更新所有100行，每秒更新一次，那么您应该完全使用
单元格表
。不，我们需要能够独立更新每个单元格（最佳情况）。JavaScript原型能够以10-15%的CPU负载（同一台机器）每秒处理相同的100条消息。所以我知道这应该是可能的。我只需要在GWT中找到最好的方法。CellTable似乎不是最好的选择。