WebViewの初回読み込みが非常に遅い

[NickQ]

はじめてお世話になります　NickQと申します。

現在、WebViewの先読み機能の実装について困っています。

 

①スプラッシュ表示時などで事前にDefaultHttpClientを用いて

　　対象のURLへアクセスしHTMLを取得します。

　　取得したHTMLをキャッシュ専用のクラス（Map）にkey(url),html(string)としてputして置きます。

②その後、WebViewでアクセスした時にキャッシュに有るURLならloadDataWithBaseURL

　　へキャッシュしたhtmlをセットしています。

　　

①の処理はWebViewを表示する前に終わっている前提ですが

この時、最初のWebViewでのloadDataWithBaseURL表示にかなりの時間がかかります。

（3Gで普通にアクセスすると5～8秒のところ15～20秒近くかかります）

 

ただし、二回目（アプリケーション上にキャッシュが出来た後）はキャッシュの読み込みはかなり早くなります。

（上記の様な遅い状態では無くなります）

 

レンダリング関係だと思い、トレースを取ってみましたが経験不足で上手く利用出来ていません

 

トレースですが

android/os/Handler.dispatchMessage(Landroid/os/Message;)v

   android/view/ViewRoot.handleMessage(Landroid/os/Message;)v

      android/view/ViewRoot.performTraversals()v

          android/view/ViewRoot.draw(Z)V

 

という処理がほぼ95%位を占めています。

 

何か回避策などを随時調べていますが、経験のある方などアドバイス頂けると助かります。

 

よろしくお願い致します。

[NickQ]

自己レスです。

 

幾つか検証して、何となく原因が掴めた気がします。

 

　遅いのは、onPageStartedからonPageFinishedの間でしたのでレンダリングかキャッシュクラス関係かと推測して

 　

　①キャッシュのクラスで扱うStringをStringBuilderへ変更したり、Guavaのライブラリで確認してみる。

　→　改善されず。 

 

　②loadDataでやってみる。

　→　レイアウトは崩れるが、表示は早い。

　

　③loadDataWithBaseURLでbaseUrl, 　historyUrlをNullで実行

　→　レイアウトは崩れるが、表示は早い。

 

　④loadDataWithBaseURLでbaseUrl, 　historyUrlを入れて実行

　→　表示がかなり遅い。

 

　という事で、通常はWebViewで表示する時にCSSや必要なJsがダウンロードされてレンダリングされるが

　DefaultHttpClientでhtmlだけ持ってきた物を利用した場合、loadDataWithBaseURLで読み込んだ段階で

　CSS、Jsをダウンロードしてレンダリングしているのかなと推測出来る。

 

　CSSの大きさとJsの大きさを確認したいのと、assetsへ配置してローカルが読めるか確認したい。

　（baseUrlをいじれば出来るのかも）

[NickQ]

自己レス②です。

 

　検証結果ですが。

　 loadDataWithBaseURLでローカルのCSSとJsを見る様に（assets）した結果、読み込みはかなり高速になりました。

　WebViewを交えたハイブリっトの場合CSSとJsの数と複雑さに配慮しないと行けない様です。

 

　具体的な何かについては、続いて調査します。

[Shigeo Mutoh]

tmhouseこと武藤です。

スプラッシュ表示タイミングでhttpClientなどで通信してデータを保管
しておくぐらいなら、そのタイミングで単にWebViewを使って通信させて
そのまま保持して、必要なとき表示させれば良いのでは？

[NickQ]

武藤様

 

返信ありがとうございます。

 

説明が足りず申し訳ありません。

 

WebViewで通常に表示しているアプリは出来ているのですが、読み込みについて

かなり遅いので改善する方法として先読みを試行しているといった感じです。

 

loadUrlなどでは、毎回CSSなどをロードしてレンダリングする様にです。

（ただキャッシュONですとキャッシュされる様です）

loadDataWithBaseURLの場合は、BaseURlをしてい出来る為、CSSなどをローカルに配置出来ます。

やり取りをするのはHTMLだけになります（その代りリダイレクトなどの処理が上手く行かないかも知れませんが）

オーバヘッドがCSSなどのダウンロードに有った場合に読み込み速度は数段改善されます。

ただ、今回調べた事で解ったのは

 

loadURLの場合は、自動でCSSなどを含めてやってくれる（だたし初回はやはり遅いがloadDataWithBaseURL程ではない）

loadDataWithBaseURLは、HTMLを読み込んだ後CSSを処理するので初回がかなり遅いが一度読んでしまうとHTMLだけのやり取り

なのでかなり早いといった感じの結果が出ています。

 

ですので、loadURLのままチューニングするならCSSやJsをAndroid向けにチューニングする

loadDataWithBaseURLで先読みするなら、ローカルにCSSなど配置する（その代り全て変えないと効果が薄い）

 

といった感じです。

2012年11月2日金曜日 22時34分37秒 UTC+9 TM: