针对移动浏览器的非常缓慢的GWT应用程序的性能优化提示

他,

也许你们中的一些人可以在GWT上分享他们的移动开发经验吗

我们正在开发一个非常互动的网站，有很多可点击的面板/按钮，并且浏览器运行速度非常缓慢。这实际上是不可能的，导航到下一页有时需要一分钟的时间

这可能是架构的一个弱点：每个元素都是一个视图，可能包含子视图。每个视图都有来自服务器的DTO支持。也许这样的深层对象图太多了，但我们正试图集中精力优化视图渲染的效率，因为将所有内容拆分为组件的想法对我们来说太重要了：）以下是我关注的一些问题，但可能还有更多

• 正如2010年谷歌I/O大会的视频所示，我已经尝试用UiBinder构建小部件。但这并没有带来多少速度提升。我们使用了很多面板——HTMLTable、HTMLPanel、VerticalPanel，因为承载其他视图的每个视图都应该以某种方式附加它们。用新的CellList替换它们会有好处吗？或者一个简单的水平面板已经足够轻了吗

• 页面上缺少可单击的小部件。虽然一般的建议是减少小部件，但我们确实需要它们来处理onMouseDown事件。CPU密集度最低的可点击组件是什么？带有鼠标向下处理程序、按钮等的VerticalPanel

• 一旦用户单击按钮，就会发出PRC请求。我注意到，如果PRC调用停止一段时间，那么单击按钮的样式呈现速度要比单击按钮后立即进行RPC调用快得多。是否有一种模式指示如何触发不会干扰样式呈现的RPC调用

• 分析报告（Firebug和Speedtracer）表明setInnerHTML（）和add（）调用占了大部分负载。当视图附加到它们的父视图时，应该调用add（），我不知道为什么setInnerHTML需要这么长时间（根据视频演示，它们应该非常快速）。是否有合理的方法来优化add（）调用？我真的想不出一个办法

---

我感谢你的每一个建议。谢谢

根据您所说的，add和setInnerHTML被大量调用。在我看来，您正在遍历大量对象并将它们添加到UI中。如果是这种情况，您可以使用（GWT2.1中已弃用）或（GWT2.1）在添加大量元素时让浏览器呼吸

此外，如果您正试图以基于网格的格式显示信息，那么您是否看过GWT2.1中的新版本

---

另一个有用的提示是尽量避免使用小部件。您提到您尝试使用UiBinder，但收效甚微。但您是否仍在使用标签和面板进行布局？一个很好的经验法则是遵循Kelly Norton的“CAN I HAZ WIDGET”图表（幻灯片27）。他还链接到，以帮助您追踪过多的小部件使用情况。我的想法是，大多数布局和标签将使用标准HTML和CSS完成。

是的，我知道新的基于单元格的小部件，但仍然不知道它们在什么情况下有用。我确实将对象集合附加到HTMLPanels/HTMLTables。比如说，CellList，这些小部件比HTMLPanel更适合布局吗？如果对象可以像这样表示，那么基于单元格的小部件可能比HTMLTables更适合布局。我认为基于单元格的小部件是在考虑显示大量数据的情况下构建的，因此它们处理添加数据的效率可能比标准小部件更高。