他的,
或许你们中的一些人可以分享他们在GWT上的移动开发经验吗?
我们正在开发一个非常互动的网站,其中包含大量可点击的面板/按钮,并且经历了巨大的浏览器迟缓。这是一个虚拟禁止,导航到下一页有时需要一分钟。
这可能是一个架构弱点:每个元素都是一个可能包含子视图的视图。每个视图都由来自服务器的DTO支持。也许这样的深度对象图太多了,但是我们正在努力专注于优化视图渲染的效率,因为将组件中的所有内容拆分的想法对我们来说是如此珍贵:)以下是我关注的一些问题,但也许有可能更多。
正如来自Google I / O Conference 2010的视频所示,我尝试使用UiBinder构建小部件。但这并没有带来太多的速度提升。我们使用了很多面板 - HTMLTable,HTMLPanel,VerticalPanel, - 因为托管其他视图的每个视图都应该以某种方式附加它们。可以用新的CellList替换它们有用吗还是一个简单的HorizontalPanel已经足够轻量了?
页面上有可点击的小部件丢失。虽然一般建议是削减小部件,但我们确实需要它们来处理onMouseDown事件。什么是CPU密集度最低的可点击组件 - 带有MouseDown处理程序的VerticalPanel,一个Button等?
用户点击按钮后,会发出PRC请求。我注意到如果PRC调用停止一段时间,那么单击按钮的样式呈现比单击按钮后立即进行RPC调用要快得多。是否有一个模式指示如何触发不会干扰样式呈现的RPC调用。
性能分析报告(Firebug和Speedtracer)表明setInnerHTML()和add()调用占了大部分负载。当视图附加到父母身份时我应该调用add(),我不知道为什么setInnerHTML需要这么长时间(根据视频演示,他们应该非常快速)。是否有合理的方法来优化add()调用?我真的想不出办法做到这一点。
我感谢每一个建议。谢谢。
答案 0 :(得分:4)
根据你的说法,add和setInnerHTML被大量调用。在我看来,你循环遍历大量对象并将它们添加到UI。如果是这种情况,您可以使用IncrementalCommand(在GWT 2.1中弃用)或Scheduler.RepeatingCommand(GWT 2.1)来让浏览器在添加大量元素时屏住呼吸。
此外,如果您尝试以基于网格的格式显示信息,您是否看过GWT 2.1中的新Cell based wigets?
另一个有用的提示是尽量避免使用Widgets。你提到你尝试过使用UiBinder,但收效甚微。但是你还在使用标签和面板进行布局吗?一个好的经验法则是遵循Kelly Norton的Measure in Milliseconds: Performance Tips for Google Web Toolkit谈话中的“CAN I HAZ WIDGET”图表(幻灯片27)。他还链接到Widget inspector bookmarklet以帮助您追踪多余的Widget使用情况。我们的想法是,大多数布局和标签都是使用标准HTML和CSS完成的。