Maybe some of you can share their mobile development experience on GWT?
We are developing a very interactive website with many clickable panels/buttons and experienced huge browser sluggishness. This is a virtual prohibition, and navigating to the next page sometimes takes a minute .
It may be an architectural weakness: each element is a view that may contain sub-views. Each view is supported by a DTO from the server. Maybe such a deep object graph is too much, but We are trying to focus on optimizing the efficiency of view rendering, because the idea of splitting everything in a component is so precious to us :)The following are some of my concerns, but maybe more.
>As shown in the video from Google I/O Conference 2010, I tried to use UiBinder to build widgets. But it did not bring much speed improvement. We used a lot of panels – HTMLTable, HTMLPanel, VerticalPanel, – Because every view that hosts other views should attach them in some way. Can replacing them with a new CellList do something good or is a simple HorizontalPanel lightweight enough?
>The clickable widgets are missing on the page. Although the general recommendation is to cut the widgets, we do need them to handle the onMouseDown event. What is the least CPU-intensive clickable component-VerticalPanel with MouseDown handler , A Button, etc.?
>As soon as the user clicks the button, a PRC request will be issued. I noticed that if the PRC call stops for a while, then the style of the button clicked is rendered much faster than the RPC call is made immediately after the button is clicked. Is there a pattern Indicate how to trigger RPC calls that do not interfere with style rendering.
>Performance analysis reports (Firebug and Speedtracer) indicate that setInnerHTML() and add() calls account for most of the load. I should call add when the view is attached to the parental status (), I don’t know why setInnerHTML takes so long (according to the video demonstration, they should be very fast). Is there a reasonable way to optimize the add() call? I really can’t think of a way to do this.
I appreciate every suggestion. Thank you.
In addition, if you try to display information in a grid-based format, you Have you seen the new Cell based wigets in GWT 2.1?
Another useful tip is to try to avoid using Widgets as much as possible. You mentioned that you have tried using UiBinder, but with little success. But are you still using tabs and panels for layout? A good rule of thumb is to follow the “CAN I HAZ WIDGET” chart in Kelly Norton’s Measure in Milliseconds: Performance Tips for Google Web Toolkit talk (slide 27). He also links to the Widget inspector bookmarklet to help you track excess Widget usage. Our idea is that most layouts and tags are done using standard HTML and CSS.
He,
Maybe some of you can share their mobile development experience on GWT?
We are developing a very interactive website with many clickable panels/buttons and experienced huge browser sluggishness. This is a virtual prohibition, and navigating to the next page sometimes takes a minute .
It may be an architectural weakness: each element is a view that may contain sub-views. Each view is supported by a DTO from the server. Maybe such a deep object graph is too much, but We are trying to focus on optimizing the efficiency of view rendering, because the idea of splitting everything in a component is so precious to us :)The following are some of my concerns, but maybe more.
>As shown in the video from Google I/O Conference 2010, I tried to use UiBinder to build widgets. But it did not bring much speed improvement. We used a lot of panels – HTMLTable, HTMLPanel, VerticalPanel, – Because every view that hosts other views should attach them in some way. Can replacing them with a new CellList do something good or is a simple HorizontalPanel lightweight enough?
>The clickable widgets are missing on the page. Although the general recommendation is to cut the widgets, we do need them to handle the onMouseDown event. What is the least CPU-intensive clickable component-VerticalPanel with MouseDown handler , A Button, etc.?
>As soon as the user clicks the button, a PRC request will be issued. I noticed that if the PRC call stops for a while, then the style of the button clicked is rendered much faster than the RPC call is made immediately after the button is clicked. Is there a pattern Indicate how to trigger RPC calls that do not interfere with style rendering.
>Performance analysis reports (Firebug and Speedtracer) indicate that setInnerHTML() and add() calls account for most of the load. I should call add when the view is attached to the parental status (), I don’t know why setInnerHTML takes so long (according to the video demonstration, they should be very fast). Is there a reasonable way to optimize the add() call? I really can’t think of a way to do this.
I appreciate every suggestion. Thank you.
According to you , add and setInnerHTML are called a lot. In my opinion, you loop through a lot of objects and add them to the UI. If this is the case, you can use IncrementalCommand (deprecated in GWT 2.1) or Scheduler.RepeatingCommand (GWT 2.1 ) Let the browser hold your breath while adding a lot of elements.
Also, if you try to display information in a grid-based format, have you seen the new Cell based wigets in GWT 2.1?
Another useful tip is to try to avoid using Widgets as much as possible. You mentioned that you have tried using UiBinder, but with little success. But are you still using tabs and panels for layout? A good rule of thumb is to follow the “CAN I HAZ WIDGET” chart in Kelly Norton’s Measure in Milliseconds: Performance Tips for Google Web Toolkit talk (slide 27). He also links to the Widget inspector bookmarklet to help you track excess Widget usage. Our idea is that most layouts and tags are done using standard HTML and CSS.