查询性能(以minimongo为单位

Question

我构建了一个响应式论坛演示，它在移动设备上呈现了一个主题列表。更新集合时没有响应。我认为原因是查询速度慢。

我的测试html：

<template name="index">
  <h1 id="myTime"></h1>
  {{#each foo}}
  <h1>{{name}}</h1>
  {{/each}}
  <input id="t" type="text"></input>
  <button id="s">submit</button>
</template>

和js：

Template.index.foo = function () {
  return Foo.find({}).fetch();
};

Template.index.events({
  "click #s": function () {
    Foo.insert({name: $("#t").val()});
  }
});

Meteor.startup(function () {
  Meteor.setInterval(function () {
    $("#myTime").text((new Date()).getTime());
  }, 1);
});

当文档数量非常少时，代码的运行速度非常快。当文档数量大于300时，渲染将停止约3秒

有没有可能改进它？:)

Answer 1

您是否在循环的每次迭代中都执行DOM插入？更容易的做法是创建一个document fragment，将所有内容都附加到它上面，然后在循环的末尾附加DOM中的片段。逻辑几乎保持不变，但浏览器在结束时只需重新绘制页面一次，而不是每次迭代。