GWT javascript background loading

Question

I use GWT to build a mobile webapp.

When I call the app on a mobile browser with a mobile internet connection, the loading of the javascript, generated by GWT, takes a long time.

So, I want to change it that way, that I first send a Start HTML-page to the client and load the GWT-javascript at background.

Is this possible?

Jama A. · Accepted Answer · 2012-02-17 13:22:43Z

2

I think you should split your code, you can find about it here: Developer's Guide - Code Splitting.
If you have large application you must use it otherwise, the entire application (i.e.javascript bundle) is downloaded in one chunk on the initial load of the application. And it helps you to decrease initial code download. See how result will be after code splitting: enter image description here

answered Feb 17, 2012 at 13:22

Jama A.

16.2k10 gold badges57 silver badges88 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Andrei Volgin Over a year ago

You can also tell the app to pre-load the next fragment even before your user decides to proceed past the start screen. GWT Developer's Guide has examples.

Eric C. · Accepted Answer · 2012-02-17 13:14:12Z

I don't really know about mobile apps but in a GWT app, the javascript is loaded into a html page inside a script tag:

<!--                                           -->
<!-- This script loads your compiled module.   -->
<!-- If you add any GWT meta tags, they must   -->
<!-- be added before this line.                -->
<!--                                           -->
<script type="text/javascript" language="javascript" src="application/application.nocache.js"></script>

If you want anything to appear before the loading of the javascript is done, just put it on that page as html. example:

<!--                                           -->
<!-- The body can have arbitrary html, or      -->
<!-- you can leave the body empty if you want  -->
<!-- to create a completely dynamic UI.        -->
<!--                                           -->
<body>

<!-- OPTIONAL: include this if you want history support -->
<iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1' style="position:absolute;width:0;height:0;border:0"></iframe>

<!-- RECOMMENDED if your web app will not function without JavaScript enabled -->
<noscript>
  <div style="width: 22em; position: absolute; left: 50%; margin-left: -11em; color: red; background-color: white; border: 1px solid red; padding: 4px; font-family: sans-serif">
    Your web browser must have JavaScript enabled
    in order for this application to display correctly.
  </div>
</noscript>

<!-- Loading indicator -->
<div id="loading">
  <div class="loading-indicator">
  <img src="images/loadingStar.gif" width="40" height="40" />Application Name<br />
<span id="loading-msg">Loading...</span></div>
</div>

<!--                                           -->
<!-- This script loads your compiled module.   -->
<!-- If you add any GWT meta tags, they must   -->
<!-- be added before this line.                -->
<!--                                           -->
<script type="text/javascript" language="javascript" src="application/application.nocache.js"></script>

Here, a div tag puts a loading gif on the page that appears until all the gwt javascript has been loaded. You can put anything you want on that page before loading the javascript.

Then in your application, (on module load) replace the content of the rootpanel with your application !!

i do it the same as you mention in your answer. But problem is still there. Problem is loading icon is remove on onModuleLoad() earlier but my website page become blank then after 5-6 secs page shows. I already using code splitting techniques but still the problem is there. Can you help me ? Website link is enggheads.com you can check it out

Peter Knego · Accepted Answer · 2012-02-17 13:33:58Z

1

There are two things to do:

Speeding up loading of the initial page: put the <script> at the bottom of HTML page.
If GWT code is large, then you can split it up in smaller chunks and load it on demand. This happens automatically if you use GWT code splitting.

answered Feb 17, 2012 at 13:33

Peter Knego

80.4k11 gold badges128 silver badges155 bronze badges

Collectives™ on Stack Overflow

GWT javascript background loading

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related