Java 在GWT页面中重画容器或单个动态元素？

我正在开发一个GWT应用程序（我是GWT的新手，所以这是一个最佳实践的请求；我还没有在so或其他地方找到任何相关的答案），其中需要一个时间表。此时间线（包含描述、标签、交互句柄和绘图）位于其自己的容器（a）中

[]//交互（导航）
2007 2008 2009 2010//标签
|    |    |    |
+第1组//可折叠组
-第2组
项目2a=====//带有绘图的项目（每个项目的绘图包装在容器中）
第2b项==
-第3组
项目3a===
项目3b===

现在，当用户浏览时间线时（使用按钮向前或向后移动），我需要重新计算布局的一些元素：

• 标签需要重新计算/重新定位
• 绘图需要重新计算/重新定位。绘图基于一组

  时隙

  元素（扩展、属性

  日期开始

  和

  日期结束

  ），这些元素已经与

  组

  相关的

  项

  相关

可折叠面板为s

据我所知，我现在有两个处理导航的选项：

我可以打开容器面板并进行完整的重画。为此，我需要为所有组保留状态（折叠/展开）。（顺便说一句，整个期间组和项目都是静态的！）这将给一次大的重画

我可以让绘图容器（每个

项

都有自己的

TimeslotContainer

，即a）保存对其所有

时隙

s的引用，然后让每个

TimeslotContainer

根据当前时间跨度重新绘制自身（即，过滤和定位相关

时隙

s）。这将给几个小的重画（每个

项目

每个扩展的

组

），优点是

披露面板

将被保留，从而保持其自身的状态

---

我倾向于采用第二种解决方案。但在这方面有什么最佳实践吗？我是否遗漏了一些常见的问题？

如果组和项目是静态的，我还建议使用第二种方法。
DOM操作（构造等）是GWT应用程序中最昂贵的函数（性能方面），因此这些DOM操作应保持在最低限度。
但是，我认为性能可能不是一个大问题，因为DOM元素的数量相对较低

不过，我仍然认为第二种方法更好。您不必存储组和项目的状态，因为它们是静态的，所以重新绘制它们是没有意义的

我只能想到第一种方法的一个优点：

---

只有一个相对简单的绘图功能。在第二种方法中，所有TimeSlotContainer都必须实现一个函数，以便重新绘制它们自己，并考虑Timespan的位置和上下文。这个函数可能比一个大的重绘函数更复杂

如果组和项目是静态的，我也推荐第二种方法。
DOM操作（构造等）是GWT应用程序中最昂贵的函数（性能方面），因此这些DOM操作应保持在最低限度。
但是，我认为性能可能不是一个大问题，因为DOM元素的数量相对较低

不过，我仍然认为第二种方法更好。您不必存储组和项目的状态，因为它们是静态的，所以重新绘制它们是没有意义的

我只能想到第一种方法的一个优点：

---

只有一个相对简单的绘图功能。在第二种方法中，所有TimeSlotContainer都必须实现一个函数，以便重新绘制它们自己，并考虑Timespan的位置和上下文。这个函数可能比一个大的重绘函数更复杂

我继续实施了一个版本的第二个解决方案，其初衷是，如果第二个解决方案没有充分发挥作用，就尝试第一个解决方案。（但这一点从未实现，因为第二种解决方案的性能非常令人满意。）

我在问题中问的主要是关于GWT实现这一点的方法。我仍然没有找到任何关于这个问题的书面材料，因此我怀疑以前没有人遗漏过这样的指导原则：）在结束我的搜索时，我将自我回答这个问题，概述我最终实现的方式以及（假设的）优缺点。谢谢你支持我的直觉。以下部分旨在解决中关于绘制方法复杂性的最后一段

---

我最终让

TimeslotContainer

s（包含

TimeSlot

s的面板）、

LabelPanel

（包含生成的

HTML

元素的面板）和

NavigationPanel

实现了一个简单的界面：

公共接口IReceivesPeriodChangedEvents{
已更改的公共无效期（）；
}

一个简单的

EventBus

处理了这些

IReceivesPeriodChangedEvents

实例上的通知过程：

公共类事件总线{
私有静态事件总线实例；
专用接收机；
专用事件总线（）{
this.receivers=new HashSet（）；
}
公共静态EventBus getInstance（）{
if（实例==null）{
instance=neweventbus（）；
}
返回实例；
}
公共无效添加接收者（IReceivesPeriodChangedEvents接收者）{
this.receivers.add（receiver）；
}
已更改的公共文件（）{
for（IReceivesPeriodChangedEvents接收方：this.receivers）{
receiver.periodChanged（）；
}
}
}

每当

TimeslotConta中的一个
          [<] [now] [>]             // Interaction (navigation)
          2007 2008 2009 2010       // Labels
          |    |    |    |
+ Group 1                           // Collapsible groups
- Group 2
  Item 2a  =====   ==               // Item with plots (plots are wrapped in container per Item)
  Item 2b    =====     ===  =
-Group 3
  Item 3a ===
  Item 3b      ===