【问题标题】:Backbone.relational, real-time and handling large dataBackbone.relational,实时和处理大数据
【发布时间】:2012-10-17 23:19:38
【问题描述】:

我正在使用 Backbone.js、node.js 和 socket.io 构建一个实时提要应用程序。

我的FeedUpdate 模型的集合。显示这些,覆盖 Backbone.sync 以与 socket.io 集成工作正常。

复杂之处在于每个Update 都有一组与之关联的cmets。当我在 Feed 视图中显示每个 Update 时,我想显示相关 cmets 的摘要(cmets 的数量和单个“最受欢迎”评论),并且还能够单击进入不同的视图单独显示每个 Update,并带有带有更多数据的 cmets 分页列表。

我用backbone-relational来建模Update模型和Comment模型的关系,如下:

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

我一直在关注这个backbone-relational 教程,但它似乎假设我想在我的Feed 视图中一次将所有相关数据保存在内存中,我不这样做,因为可能有数千个实时更新的 cmets:

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

我的问题是:

  1. 如何在我的 Feed 视图中为每个 Update 引入 cmets 的摘要数据而不加载所有评论数据,同时保持在我的 Update 视图中显示分页完整数据的能力?
  2. 我正在使用backbone.layoutmanager 来呈现我的视图。我应该如何最好地打破我的观点来实现上述目标?

【问题讨论】:

    标签: node.js backbone.js socket.io backbone-relational


    【解决方案1】:

    对于第一季度:

    • 我假设您使用 ioSync 之类的东西在 Backbone.sync 中使用 socket.io 而不是 REST API,或类似的解决方案。
    • Update 上包含元数据(例如# of cmets)作为属性。如果您的 Update 对象本身很重,您可以使用 ioBind 和自定义服务器端 socket.io 事件来更新计数,而不是每次都发送整个对象。
    • Update 中包含属性topComment 作为附加的一对一关系。最初从服务器加载 Update 时,在响应中包含 topComment,但不包含其他 cmets。
    • 使用自定义 socket.io 事件延迟加载其余的 cmets。您可能需要一个以updateIdstartIndexmaxComments 作为参数的服务器端处理程序,它返回从给定索引开始的给定Update 的 cmets 列表。如果结果以 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 解决它们时,避免为所有cmets 发送ID。我很难学到这一点:O/

    • 您还可以将 cmets 集合直接存储在视图上,而不将其关联为 Update 的关系

    对于第二季度:

    我对@9​​87654339@ 没有任何经验,因为我使用Backbone.Marionette 来管理我的视图。 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;
      }
    });
    

    注意:上面的代码 sn-ps 没有按原样测试。

    【讨论】:

      猜你喜欢
      • 2014-07-13
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-08-03
      • 1970-01-01
      • 2020-03-31
      相关资源
      最近更新 更多