0

当我的 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); 
}

注意：此循环不会长时间阻塞浏览器。使用的所有加载函数都是异步的（请参阅上面评论中的列表）。

如果机器速度慢，加载过程可能需要一两分钟。一些浏览器，尤其是移动浏览器，很容易显示“页面上的脚本没有响应”错误或等效的错误——尽管实际页面是完全响应的（我什至尝试在加载屏幕中包含一些交互元素并强制用户点击他们，没有帮助），并且几乎所有繁重的工作都是在浏览器自己的资源加载代码中完成的。

我能做些什么来防止这些错误的产生？

4

0 回答 0