Question

我正在使用Backbone.js，node.js和socket.io构建实时订阅源应用程序。

我的Feed是Update型号的集合。显示这些内容，覆盖Backbone.sync以与socket.io集成可以正常工作。

复杂性在于每个Update都有一组与之关联的注释。当我在Update视图中显示每个Feed时，我想显示相关评论的摘要（评论数量和单个“最常用”评论），并且还可以点击使用带有更多数据的分页评论列表，以不同的视图显示每个Update。

我正在使用backbone-relational来模拟Update模型与Comment模型之间的关系，如下所示：

Feed (collection) -> Update (model) -(has many)-> Comment (model)

我一直在关注这个backbone-relational教程，但它似乎假设我想在我的Feed视图中同时将所有相关数据存储在内存中，我不这样做可能有数千条评论实时更新：

http://antoviaque.org/docs/tutorials/backbone-relational-tutorial/

我的问题是：

如何在Update视图中为每个Feed引入评论摘要数据而不加载所有评论数据，并且还能够在我的Update中显示分页的完整数据视图？
我正在使用backbone.layoutmanager来渲染我的观点。我最好如何打破自己的观点来完成上述工作？

Answer 1

对于Q1：

我假设您正在使用ioSync之类的东西在Backbone.sync中使用socket.io而不是REST API或类似的解决方案。
在Update上包含元数据（例如评论数）作为属性。如果您的Update对象本身很重，您可以使用ioBind和自定义服务器端socket.io事件更新计数，而不是每次都发送整个对象。
在topComment中添加属性Update作为额外的一对一关系。最初从服务器加载Update时，请在回复中包含topComment，而不是其他评论。
使用自定义socket.io事件延迟加载其余注释。您可能需要一个服务器端处理程序，它以参数updateId，startIndex，maxComments为参数，从给定的索引开始返回给定Update的注释列表。如果结果以JSON的形式发送到客户端，那么在客户端上执行类似的操作很容易：
```
// Assume `model` is an instance of `Update`.
socket.emit('get_comments_page', {
  updateId: model.get('id'),
  startIndex: 1,
  maxComments: 10
}, function(err, data) {
  if (err) {
    alert('Unable to fetch comments: ', err);
  } else {
    model.get('messages').reset(data)
  }
});
```
在提取Update然后尝试使用fetchRelated解决问题时，请避免为所有评论发送ID。我很难学到这一点：O /
您还可以将评论集合直接存储在视图中，而不将其关联为Update

第二季度：

我使用Backbone.Marionette来管理我的观看时，对layoutmanager没有任何使用经验。 Marionette有async extension（免责声明：我是共同维护者）。我鼓励看看Marionette.async如何处理延迟渲染，等待数据从服务器到达。

主要思想是使用jquery的Deferred对象来解析数据何时从服务器返回。使用deferred：

扩展上面的示例

var MyView = Backbone.View.extend({
  // ... normal stuff that views need ...
  initialize: function() {
    var deferred = $.Deferred();
    // Assume `model` is an instance of `Update`.
    var that = this;
    socket.emit('get_comments_page', {
      updateId: that.model.get('id'),
      startIndex: that.options.pageNumber,
      maxComments: 10
    }, function(err, data) {
      if (err) {
        alert('Unable to fetch comments: ', err);
      } else {
        that.model.get('messages').reset(data)
      }
      deferred.resolve();
    });
    this.promise = deferred.promise();
  },

  render: function() {
    var that = this;
    this.promise.done(function() {
      // Do your normal rendering code here, for instance:
      $(that.el).html(that.template(that.model.toJSON()));
    });
    return this;
  }
});

注意：上面的代码段不会按原样进行测试。

Backbone.relational，实时和处理大数据

1 个答案: