During development, a GWT application can be run in different modes, and there's often a bit of confusion about when it's necessary to
- restart the server,
- reload the server,
- refresh the browser,
- or just click somewhere in the web page.
Let's take a step back and look at all the differences between Development mode/Production mode on the one hand, and "With Debugger"/"Without Debugger" on the other hand. Of course, everybody using GWT has already heard of them...
Mode
Development mode
Runs the client side with a special browser plugin that attaches to a code server. You can always identify this mode easily by looking at the URL - it will contain something like ?gwt.codesvr=127.0.0.1:9997
The main advantage of Development mode is, that it doesn't require you to compile your code to JavaScript first - it runs the client side as Java bytecode in the code server. This is basically a JavaScript emulation - but it's so close, that most people don't notice the difference anymore (some even believe, that GWT compiles Java to JavaScript in Development mode, which is not the case.)
Since the code is run as Java bytecode, this mode also allows you to attach a debugger for the client side code, as we will see a little bit below (but you don't have to!)
Production mode
Runs the client side as compiled JavaScript. Before you can use it, you have to use the GWT Java to JavaScript compiler first (often known as gwtc
, or "the one with the
icon")
After it's finished (takes a while!) just start the GWT embedded server like in development mode, but this time remove the ?gwt.codesvr=127.0.0.1:9997
from your URL. (Alternatively, you can deploy the war to a separate server (e.g. Tomcat), and run it from there.)
The advantage here is, that a) you can test the real compiled result, and b) that browser refresh is very much faster than in Development mode.
Launching
"Without Debugger"
You can simply run the application without attaching a debugger (that's possible both in Development and Production mode). Use "Run As...", if you use Eclipse.
In Development mode, this means that you run a web server (embedded Jetty, usually on port 8888) and a code server (usually port 9997). In Production mode, you don't need the code server.
If you have client side changes, they will be reloaded when you refresh the browser. This is relatively fast - you don't have to restart the (code) server. But it's not as immediate as with a Debugger.
If you have server side changes, you will have to do a server web application reload (in Eclipse, you use the small yellow reload icon in the Development view) This is much faster than a full server restart, but once again, it's not as immediate as with a Debugger!
"With Debugger"
Both in Development and Production mode, you can run the application with an attached debugger. Use "Debug As...", if you use Eclipse.
For Development mode, the debugger attaches both to the client and the server side of the code - whereas in Production mode, it can only attach to the server side!
If you have client side changes with an attached debugger, code changes will take effect immediately, so all you have to do is to click somewhere in your web page that causes the code to run.
If you have server side changes with an attached debugger, likewise, code changes will take effect immediately, so all you have to do is to perform some action that causes the corresponding server call.
All of this is extremely fast, but the drawback is, that Java debuggers can cope only with certain kinds of code changes. If you have more severe changes, the debugger will exit, and you'll have to restart the server (I'm still looking for a way to just reload and reattach in this case - I think it should be possible, but does anyone already have a working solution?)
Also, with debuggers, you'll have to be careful with the state of your application. Remember, that the changes to your code won't re-evaluate the existing state!
So you basically have four combinations
- Development mode without Debugger
- Client change: Use browser refresh (medium)
- Server change: Reload server (fast)
- Development mode with Debugger
- Client change/server change: Just click on the web page (very fast). Restart server, if this fails (very slow).
- Production mode without Debugger
- Client change: Recompile, then refresh browser (very slow)
- Server change: reload server (fast)
- Production mode with Debugger (for the server side)
- Client change: Recompile, then refresh browser (very slow)
- Server change: Just click on the web page to cause a new server call (very fast). Restart server, if this fails (very slow).
Additional differences:
- A simple browser refresh in Production mode is much faster than in Development mode.
- GWT-RPC in Production mode is much faster than in Development mode.
Each combination has its own benefits and drawbacks for development speed and convenience. I like to use all of them, depending on the situation.
This post has become a bit long, but I have seen lots of questions around this topic, and I wanted to write it all down in one place. Thanks for reading :-)