2012-02-17 13 views
0

私はGWTを使ってモバイルwebappをビルドします。GWT javascript background load

モバイルインターネット接続のモバイルブラウザでアプリを呼び出すと、GWTによって生成されたjavascriptの読み込みに時間がかかります。

このように、私は最初にHTMLページをクライアントに送信し、バックグラウンドでGWT-javascriptをロードするように変更したいと思います。

これは可能ですか?

私は本当にモバイルアプリケーションについては知らないが、GWTのアプリでは、Javascriptをスクリプトタグ内のHTMLページにロードされ

答えて

1

<!--           --> 
<!-- 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> 

あなたがのロード前に表示するために何かをしたい場合javascriptが完了したら、htmlとしてそのページに置いてください。 例:ここでは

<!--           --> 
<!-- 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> 

、divタグがロードされているJavaScriptのすべてのGWTまで表示されるページ上読み込みGIFを置きます。 javascriptをロードする前に、そのページに必要なものを置くことができます。

あなたのアプリケーションでは(モジュールロード時)、ルートパネルの内容をアプリケーションに置き換えてください!!

+0

あなたの答えは同じです。しかし問題はまだそこにあります。問題は、以前はonModuleLoad()で削除アイコンが削除されていますが、私のWebサイトのページは空白になり、5〜6秒後にページが表示されます。私はすでにコード分割技術を使用していますが、まだ問題はあります。手伝って頂けますか ?ウェブサイトのリンクは[enggheads.com](https://www.enggheads.com)です。 –

2

私はあなたのコードを分割する必要があると思う、あなたはそれについてここで見つけることができる:Developer's Guide - Code Splitting
大規模なアプリケーションを使用する場合は、それを使用する必要があります。アプリケーションの初期ロード時に、アプリケーション全体(つまり、javascriptバンドル)が1つのチャンクにダウンロードされます。また、初期コードのダウンロードを減らすのに役立ちます。結果は、コード分割後になりますどのように参照してください: enter image description here

+0

ユーザーが開始画面を過ぎて進むことを決定する前に、次の断片をあらかじめロードするようにアプリに指示することもできます。 GWT開発者ガイドには例があります。 –

1

行うには二つのことがあります。

  1. は、最初のページの読み込みを高速化:HTMLページの下部にある<script>を置きます。

  2. GWTコードが大きい場合は、小さな塊で分割して必要に応じて読み込むことができます。これは、GWT code splittingを使用すると自動的に発生します。