2

我的backbone.js 应用程序第一次加载时,在加载模板之前需要整整6 秒的空白屏幕。我们有一些 javascript 库膨胀,构建过程还不完美,但这些是单独的问题。

我正在使用带有 require.js 的骨干样板,我希望有一种 gmail 类型的加载器,它会在所有资产、数据、模板被加载和渲染时显示出来,这样我们就不会只加载一个空白页。

反正有做这样的事情吗?

4

1 回答 1

4

我解决这个问题的方法是在 index.html 中包含一个动画微调器 GIF:

<html>
  <!-- header with scripts etc -->
  <body>
    <img id="spinner" class="centered" src="/images/spinner.gif"></img>
  </body>
</html>

当所有资产都下载完毕,模型初始化并且应用程序的主视图准备好呈现时,我只需将微调器替换为内容:

var appView = new AppView().render();
$("img#spinner").replaceWith(appView.el);

它本身并不显示进度,但它让用户知道正在加载。

可能有一种方法可以连接到 requirejs 加载事件,但我不知道有一个。如果您打算将所有资源缩小并合并到一个文件中,那么无论如何这将不太有用,因为不可能非常准确地跟踪单个文件的下载进度。

于 2012-12-18T17:23:06.977 回答