Application loading time optimization using code splitting.

 One of the advantages of GWT is the different optimizations that it applies to your application to make it as fast and as responsive as possible. The GWT compiler systematically goes through an optimization phase ( pre-compile) before starting any compilation task, unless specified by the developer. For example, one of the optimizations that GWT pre-compile phase applies is getting rid of the unused code (using the Pruner), so that the size of the Js module will be as compact as possible. We will talk in more detail about the different optimizations that GWT compiler applies in future posts. In this post, we want to address another type of optimization that the developer can introduce to optimize application loading time: code splitting.

  Code splitting can be defined as asynchronous code download to the client side. As the name implies, code splitting creates many split points in the application in which the code is not downloaded unless needed. For example, suppose you have a table with an on row select event. the row select performs several operations, and displays some details on the screen. As long as the user does not select any row, we don’t need the code that lies behind the select event, so we could get rid of it to optimize initial page loading time. The code will be only downloaded if a row is clicked. We can specify to GWT to split the code by using the following:

GWT.runAsync(new RunAsyncCallback(){

			@Override
			public void onFailure(Throwable reason) {
				GWT.log("Failed to download code");
				
			}

			@Override
			public void onSuccess() {
				//your code here	
			}
		});

It is up to the developper to define the split points, and the places where these points are introduced can play a big difference. To make code splitting effective, GWT provides an interesting tool called the compile report that allows to analyse how much code is downloaded and how much is left over. Usually, the developer should iterate several times through the code to make split points as optimized as possible. An example of the compile report is bellow:

For enquiries contact Francesca Tosi

Archive

Subscribe

Atom