javascript - リソースのロード中に「ページ上のスクリプトが応答しません」というエラーを取り除く

Question

私の HTML5 アプリが起動すると、ユーザーに非インタラクティブな読み込みページを表示しながら、一連のリソースを読み込みます。

このようなもの（疑似コード）：

<div id="app">
  <div class="loading-screen">Loading, please wait</div>
</div>

 

var to_load = resources.length;
var on_load = function() {
  --to_load;
  if (to_load <= 0) {
    document.getElementByID("app").innerHTML = app_html;
    on_everything_loaded();
  }
}
for (var i = 0; i < resources.length; ++i) {
  // Loaded here:
  // -- AJAX requests via xhr
  // -- Image objects
  // -- decodeAudioData, takes most of the time
  resources[i].load(on_load); 
}

注: このループはブラウザを長時間ブロックしません。使用されるすべての読み込み関数は非同期です (上記のコメントのリストを参照してください)。

マシンの速度が遅い場合、読み込みプロセスに 1 ～ 2 分かかる場合があります。一部のブラウザ、特にモバイルブラウザは、実際のページが完全に応答しているにもかかわらず、「ページ上のスクリプトが応答しません」または同等のエラーを表示する傾向があります (読み込み画面にインタラクティブな要素をいくつか含めて、ユーザーにクリックするように強制することさえ試みました)。それらは役に立ちませんでした)、ほとんどすべての重い作業は、ブラウザ独自のリソース読み込みコード内で行われています。

これらのエラーが生成されないようにするにはどうすればよいですか?