GWT: When to use LazyDomElement?

Question

I read GWT to prepare my first GWT application and stumbled upon LazyDomElement and find it intriguing.

As I understand it, when you really want to create your own subclass of Widget (and not just extend the Composite ), you need to do all kinds of additional work for the interaction of this widget with the DOM.

So, I ask: what is the “extra work” you have to do - what you get (essentially) free from the Composite subclass - and how you can use LazyDomElement to make it easier or improve performance

Answer 1

From the documentation and source code of GWT, it seems that this class has only UIBinder functionality, and none of the base GWT widgets use this class. The main and only function of LazyDomElement is deferred access to your widget fields. Say you have a widget with a template:

 <gwt:HTMLPanel> <div ui:field="lazyField" /> <div ui:field="generalField" /> <!-- Other fields --> </gwt:HTMLPanel> 

and the Java class for it:

 public class MyCoolWidget extends UIObject { interface MyUiBinder extends UiBinder<DivElement, MyCoolWidget> {} private static MyUiBinder uiBinder = GWT.create(MyUiBinder.class); @UiField LazyDomElement<DivElement> lazyField; @UiField DivElement generalField; // all other fields … public MyCoolWidget() {  // Initializes all your fields and also calls 'getElementById' for all // not lazy fields of your widgets to have a reference to them. // There could be hundreds of them if you are building really cool app, // and also they could be hidden (eg other tab on UI) and not required // to be accessed at all for some cases.  setElement(uiBinder.createAndBindUi(this)); } public void setLazyField(String value) { // Finally we need to modify the field, ok, // we access the DOM only at this moment // (please take a look at 'get()' method implementation for details) lazyField.get().setInnerText(name); } public void setGeneralField(String value) { // Reference to element is already there, we are just going // to change it property generalField.setInnerText(name); } } 

So, the reason for using it depends only on the specific case of your application, you need lazy loading of the elements of your widget or not.

UPD I must say that I have not used this class in real projects :). I can imagine some kind of scenario. For example, you need to create a ticket booking panel. With the following initial requirements:

• If you need to reserve tickets for N travelers
• The input forms for each traveler are equal and quite heavy (rich html, many input fields).

So, you need to display up to 10 identical rich forms at a time, without having to access their fields before the page loads. We could build a ReservationForm widget ( ReservationForm.ui.xml with markup and ReservationForm.java for some logic) and use LazyDomElement for input fields to save our first load time.