在流星应用程序中加载大型集合

Question

在Meteor应用程序中，包含1000条记录的大型集合将发布到客户端。但是，加载{{loginButtons}的用户将经历3-5秒的延迟，因为它仅在所有大型集合加载后完全呈现。

#login-buttons呈现的div {{ loginButtons }}似乎会在页面加载时立即呈现，但 div #login-dropdown-list正在花费一些时间开始渲染。 #login-dropodown-list template

该网站正在使用Meteor 0.7.0.1和Iron Router。

---

更新

以下是accounts-ui-bootstrap-3下拉菜单的模板代码，在其余页面呈现后需要几秒钟才能加载。它只是Meteor软件包的基本模板，没什么特别的。

<ul class="nav navbar-nav navbar-right">
    {{ loginButtons }} 
</ul>

我曾经认为问题是由于使用Meteor.users集合的下拉菜单，所以这是我的快速渲染路线。

FastRender.onAllRoutes(function(urlPath) {
  this.subscribe(Meteor.users);
  this.subscribe(users);
})

这似乎没有帮助解决这个问题。我还发现，当下拉菜单仍未呈现时，Meteor.userId()已经定义。下拉菜单仅在红色箭头指向的时间点出现/呈现，这是所有集合已加载的点。

此外，#login-buttons呈现的div {{ loginButtons }}会在页面加载时立即呈现，但 div #login-dropdown-list正在花费一些时间开始渲染。

也许这是accounts-ui-bootstrap-3处理渲染的方式？

Answer 1

您可以在特定路由和waiton属性上使用iron-router的loadingTemplate，以便在订阅准备就绪时向用户显示进度指示器。如https://github.com/EventedMind/iron-router#waiting-on-subscriptions-waiton

所示

Router.configure({
  layoutTemplate: 'layout',
  notFoundTemplate: 'notFound',
  loadingTemplate: 'loading'
});

Router.map(function () {
  this.route('postShow', {
    path: '/posts/:_id',

    waitOn: function () {
      return Meteor.subscribe('posts');
    }
  });
});

此外，https://atmosphere.meteor.com/package/fast-render是第三方软件包，它集成到铁路由器中，并将初始数据与模板一起发送，从而使页面立即显示加载数据。

http://meteorhacks.com/integrating-iron-router-based-apps-with-fast-render.html

有一个很好的教程

Answer 2

我看到另外两个可以帮到你的软件包：

分页订阅： https://atmosphere.meteor.com/package/paginated-subscription 这里的想法是为初始加载设置一个小的限制，当加载其余的时，更改限制以加载其余的

延迟订阅： https://atmosphere.meteor.com/package/lazy-subscription 这里的想法是不要在第一时间订阅你的大型系列;只是这样初始化：

Post = new Meteor.Lazy（'post'，function（）{     Meteor.subscribe（ '信息'）; }）;

（它没有订阅任何东西）

然后准备好了： Template.some_template.get_posts = function（）{     return Post（）。find（{}）; //注意Post现在是一个函数。 }; =＆GT;它订阅

第二种解决方案可能看起来更直接，但您可以使用第一种解决方案更好地管理它。