Google News
logo
Java GWT Interview Questions
Google Web Toolkit (GWT) is a development toolkit for building ajax application using Java. GWT insist on reusable approaches to common web-app tasks such as bookmarking, UI abstraction, cross-browser portability, etc.
 
GWT provides two modes :
 
* Development Mode : It allows debugging the Java code of the application directly via the standard Java debugger.
* Web mode : In this, the application is translated into HTML and JavaScript code. It can be deployed to a web server.
It is one of the most important Java technologies with amazing features. Some cool features are :
 
* It provides excellent development tools like code refactoring, code navigation, etc. via eclipse.
* A single code base for client and server.
* It helps the server and client to quickly reloaded after making changes in it.
* In this, development tools are easy to install, for that, you need only two eclipse plugins.
* It supports IDE that helps with several coding tasks and errors.
* GWT generates a WAR file which makes easier for the deployment of applications.
* It provides a faster and reliable GUI layout.
* It also allows writing web applications offline, as it relies so little on the server.
Following are the core components of GWT :
 
GWT Java to JavaScript compiler : This is the most important part of GWT which makes it a powerful tool for building RIAs. The GWT compiler is used to translate all the application code written in Java into JavaScript.
 
JRE Emulation library : Google Web Toolkit includes a library that emulates a subset of the Java runtime library. The list includes java.lang, java.lang.annotation, java.math, java.io, java.sql, java.util and java.util.logging.
 
GWT UI building library : This part of GWT consists of many subparts which includes the actual UI components, RPC support, History management, and much more.
 
GWT Hosted Web Browser : GWT Hosted Web Browser lets you run and execute your GWT applications in hosted mode, where your code runs as Java in the Java Virtual Machine without compiling to JavaScript.
A GWT application consists of following four important parts out of which last part is optional but first three parts are mandatory :
 
* Module descriptors
* Public resources
* Client-side code
* Server-side code
A module descriptor is a configuration file used to set-up a GWT application. Its file extension is *.gwt.xml, where * is the name of the application and this file should reside in the project's root.
A GWT module is simply an encapsulation of functionality. It shares some similarities with a Java package but is not similar.
7 .
What is the purpose of 'inherits' tag in *.gwt.xml file in GWT?
This adds other gwt module in application just like import does in java applications. Any number of modules can be inherited in this manner.
8 .
What is the purpose of 'entry-point' tag in *.gwt.xml file in GWT?
This specifies the name of class which will start loading the GWT Application.
The GWT compiler recognizes the -ea flag to generate code for assertions in the compiled JavaScript. Only use assertions for debugging purposes, not production logic because assertions will only work under GWT's development mode.
By default, the class name for each component is gwt-. For example, the Button widget has a default style of gwt-Button, and similar way TextBox widget has a default style of gwt-TextBox.
Some standard modules are :
 
* User Module : It contains core GWT functionality
* HTTP Module : It consists of Low-level HTTP communications library
* JSON Module : It has JSON creation and parsing
* JUnit Module : It contains JUnit testing framework integration
* XML Module : It includes XML document creation and parsing
The most important public resource is host page which is used to invoke actual GWT application. A typical HTML host page for an application might not include any visible HTML body content at all, but it is always expected to include GWT application via a <script.../> tag.
13 .
RPC (Remote Procedure Call) helps in client communication with the server. RPC is a process of calling a method from a class; however, in this process, the only difference is that the class is located on a server but not the part of the client program.
* Root Panel : It is the topmost panel where all other widgets are attached to it.
* Flow Panel : It is the simplest panel which provides a basic HTML layout.
* HTML Panel : It is enclosed with specified HTML contents.
* Form Panel : It specifies that any widget declared in this would be wrapped in HTML form element.
* Scroll Panel : It puts all the content in the scrollable area.
* Grid : It helps to create an HTML table.
* Flex Table : It extends HTML table like a GRID, but here we can create a table on demand.
Layout Panels can contain other widgets. These panels control the way widget is displayed on User Interface. Every Panel widget inherits properties from Panel class which in turn inherits properties from Widget class and which in turn inherits properties from UIObject class.
JSON(JavaScript Object Notation) is a language-independent format for data. It is similar to XML as XML uses tags JSON uses Object-Literal notation of JavaScript.
AsyncDataProvider ties your cell widgets to an asynchronous data source. The AsyncDataProvider used to fetch the new data when the cell widget requires new data and then push it to the widget. To request the new data, implement the oRangeChanged() method for the specified cell widget. To push the data, call updateRowCount() and/or updateRowData() methods.
UiBinder is a framework used to separate the functionality and view of a user interface. It allows developers to build GWT applications such as HTML pages with GWT widgets.
 
* It collaborates with UI designers who like to work in XML, HTML, and CSS than Java source code
* It increases productivity as it is easy to create UI from scratch.
* It encourages the separation of the programming logic i.e. Java code from UI.
* It prefers lightweight HTML elements over heavyweight widgets and panel, which directly increase the use of browser resources efficiently.
* Provides direct support for internationalization that works well with GWT.
* Provides thorough compile-time verification of cross-checking from XML to java source and vice-versa.
It is not correct to say that GWT is meant to develop applications that run on browsers. As we know GWT is based on Java and translate Java to JavaScript, and also includes IDE and Ui support which helps to make web apps. You can make some application wrappers that takes JavaScript applications native to androids or other operating systems of mobiles. This is how you can design mobile apps with the use of a glue layer present in between native wrapper and GWT for a JavaScript app.
 
Yeah, it is true that you can't make apps only with GWT, instead, you need other libraries. Thus, it is fully possible to make apps using GWT by combining it with other libraries
20 .
How onModuleLoad() functions get called if multiple entry-point classes are specified in *.gwt.xml?
They are called sequentially in the order in which entry-point classes appear in the module file. So when the onModuleLoad() of your first entry point finishes, the next entry point is called immediately.
21 .
What is the purpose of 'source' tag in *.gwt.xml file in GWT?
This specifies the names of source folders which GWT compiler will search for source compilation.
22 .
What is the purpose of 'public' tag in *.gwt.xml file in GWT?
The public path is the place in your project where static resources referenced by your GWT module, such as CSS or images, are stored.
23 .
What is the purpose of 'script' tag in *.gwt.xml file in GWT?
Automatically injects the external JavaScript file located at the location specified by src.
24 .
What is the purpose of 'stylesheet' tag in *.gwt.xml file in GWT?
Automatically injects the external CSS file located at the location specified by src.
To parse the XML, we have to first parse the raw XML text into XML DOM structure. DOM structure helps in the navigation of the data. XML parser is located under XMLParser class. XMLParser class consists of parse(String) static method which is called to parse the XML and return a Document object.
Element : represents DOM elements, which are specified by tags in XML: <someElement></someElement>.
Text : represents the text between the opening and closing tag of an element: <someElement>Here is some text.</someElement>.
Comment : represents an XML comment : <!-- notes about this data -->.
Attr : represents an attribute of an element: <someElement myAttribute="123" />.
History mechanism is similar to the Ajax history implementations such as RSH (Really Simple History). The Basic idea is to track the internal application state in the URL fragment identifier. Main advantages of this mechanism are:
 
* It provides browser history reliable.
* It provides useful feedback to the user.
* It is bookmarkable, i.e., the user can create a bookmark to the current state and save it or can email it, etc.
Google Web Toolkit offers a variety of ways for creating the custom widgets. The easiest way is to develop composite widgets by grouping existing basic widgets and adding some interaction logic to them.
 
To create a Custom Widget, it has three general concepts which are as follows : 
 
* Building Composite Widgets.
* Create the Java Code for the new widget.
* Wrap JavaScript using JSNI methods.
29 .
What is *.nocache.js file in GWT?
It contains the javascript code required to resolve deferred binding configuarations (for example, browser detection) and to use lookup table generated by GWT compiler to locate one of the .cache.html.
Following are the steps of bootstrap proceure for GWT application when a browser loads the GWT application :
 
* Browser loads the host html page and .nocache.js file.
 
* Browser executes the .nocache.js file's javascript code.
 
* .nocache.js code resolves deferred binding configuarations (for example, browser detection) and use lookup table generated by GWT compiler to locate one of the .cache.html.
 
* .nocache.js code then creates a html hidden iframe, inserts that iframe into the host page's DOM, and loads the .cache.html file into the same iframe.
 
* .cache.html contains the actual program of a GWT application and once loaded in iframe shows the GWT application in the browser.
GWT compiler generates .nocache.js file every time with the same name whenever a GWT application is compiled. So browser should always download the .nocache.js file to get the latest gwt application. gwt.js code actually appends a unique timestamp at the end of the file name so that browser always treat it a new file and should never cache it.
HorizontalSplitPanel widget represents a panel that arranges two widgets in a single horizontal row and allows the user to interactively change the proportion of the width dedicated to each of the two widgets. Widgets contained within a HorizontalSplitPanel will be automatically decorated with scrollbars when necessary.
VerticalSplitPanel widget represents a A panel that arranges two widgets in a single vertical column and allows the user to interactively change the proportion of the height dedicated to each of the two widgets. Widgets contained within a VertialSplitPanel will be automatically decorated with scrollbars when necessary.
FlexTable widget represents a flexible table that creates cells on demand. It can be jagged (that is, each row can contain a different number of cells) and individual cells can be set to span multiple rows or columns.
Grid widget represents a rectangular grid that can contain text, html, or a child Widget within its cells. It must be resized explicitly to the desired number of rows and columns.
DeckPanel is a panel that displays all of its child widgets in a 'deck', where only one can be visible at a time. It is used by TabPanel.
This widget represents a panel that lays its child widgets out "docked" at its outer edges, and allows its last widget to take up the remaining space in its center.
This widget represents a panel that contains HTML, and which can attach child widgets to identified elements within that HTML.
This widget represents a panel that represents a tabbed set of pages, each of which contains another widget. Its child widgets are shown as the user selects the various tabs associated with them. The tabs can contain arbitrary HTML.
This widget represents a type of widget that can wrap another widget, hiding the wrapped widget's methods. When added to a panel, a composite behaves exactly as if the widget it wraps had been added.
This widget represents a panel that wraps its contents in an HTML <FORM> element.
This widget represents a panel that can pop up over other widgets. It overlays the browser's client area (and any previously-created popups).
This widget represents a form of popup that has a caption area at the top and can be dragged by the user. Unlike a PopupPanel, calls to PopupPanel.setWidth(String) and PopupPanel.setHeight(String) will set the width and height of the dialog box itself, even if a widget has not been added as yet.
GWT provides a event handler model similar to Java AWT or SWING User Interface frameworks.
 
A listener interface defines one or more methods that the widget calls to announce an event. GWT provides a list of interfaces corresponding to various possible events.
 
A class wishing to receive events of a particular type implements the associated handler interface and then passes a reference to itself to the widget to subscribe to a set of events.
 
For example, the Button class publishes click events so you will have to write a class to implement ClickHandler to handle click event.
 
All GWT event handlers have been extended from EventHandler interface and each handler has only a single method with a single argument. This argument is always an object of associated event type. Each event object have a number of methods to manipulate the passed event object.
GWT provides three ways to create custom user interface elements. There are three general strategies to follow :
 
Create a widget by extending Composite Class : This is the most common and easiest way to create custom widgets. Here you can use existing widgets to create composite view with custom properties.
 
Create a widget using GWT DOM API in JAVA : GWT basic widgets are created in this way. Still its a very complicated way to create custom widget and should be used cautiously.
 
Use JavaScript and wrap it in a widget using JSNI : This should generally only be done as a last resort. Considering the cross-browser implications of the native methods, it becomes very complicated and also becomes more difficult to debug.
In order to use GWT History support, we must first embed following iframe into our host HTML page.
 
<iframe src="javascript:''" id="__gwt_historyFrame" style="width:0;height:0;border:0"></iframe>

SystemLogHandler logs to stdout and these messages can only be seen in Development Mode in the DevMode window.
This handler sends log messages to the server, where they will be logged using the server side logging mechanism.
ConsoleLogHandler logs to the javascript console, which is used by Firebug Lite (for IE), Safari and Chrome.
DevelopmentModeLogHandler logs by calling method GWT.log. These messages can only be seen in Development Mode in the DevMode window.
JSNI (JavaScript Native Interface) is used to solve problems such as when we need to integrate GWT with existing handwritten JavaScript or with a third-party JavaScript library. Occasionally we need to access low-level browser functionality which is not exposed by the GWT class API's.
JSNI is a web equivalent of inline assembly code and can use in many ways such as :
 
* Implement a Java method directly in JavaScript.
* Wrap type-safe Java method signatures around existing JavaScript.
* Call from JavaScript code into Java code and vice-versa.
* Throw exceptions across Java/JavaScript boundaries.
* Read and write Java fields from JavaScript.
* Use development mode to debug both Java source (with a Java debugger) and JavaScript (with a script debugger).
The logging framework emulates java.util.logging, so it uses the same syntax and has the same behavior as server side logging code.
 
* GWT logging is configured using .gwt.xml files.
 
* We can configure logging to be enabled/disabled; we can enable/disable particular handlers, and change the default logging level.
This technique is the most powerful among the three techniques. Implementing Localizable allows us to create localized versions of custom types. It's an advanced internationalization technique.
This technique is very flexible but slower than static string internationalization. Host page contains the localized strings therefore, applications are not required to be recompiled when we add a new locale. If GWT application is to be integrated with an existing server-side localization system, then this technique is to be used.
This technique is most prevalent and requires very little overhead at runtime; is a very efficient technique for translating both constant and parameterized strings;simplest to implement. Static string internationalization uses standard Java properties files to store translated strings and parameterized messages, and strongly-typed Java interfaces are created to retrieve their values.
Layout panels are the most general layout mechanism, upon which other layouts are built. Layout panel contains other widgets which control the way widgets to be shown on User Interface. The panel widgets follow the properties of panel class which means inherits properties from panel class. These panel class takes the properties from widget class which in turns takes the properties from UIObject class.
 
List of Basic panels available in GWT :
 
* Root panel : it is the topmost panel and all other widgets are attached are attached to it. Use RootPanel.get(String id) to obtain a panel for any other element on the page.
* Flow panel : It is the simplest panel which creates a single element and attaches children to it without any modification.
* HTML panel : This panel offers a simple way to define HTML structures, most commonly used in UiBinder templates.
* Form panel : it is used to reproduce the behavior of an HTML form.
* Scroll panel : it is used to create a scrollable area within another panel.
* Popup panel and DialogBox panel : To create simple pops and dialogs, these panels are used.
* Grid and Flex table : these are used to create HTML table elements.