1

我有一个订阅 4 个集合的应用程序(每个集合非常小,只有 1 到 20 条记录)。但是加载这些集合所花费的时间是巨大的。其中一个只有 13 条记录,加载它的模板需要几秒钟。正常吗?(我仍在流星服务器上进行测试)

这是代码示例:

Meteor.subscribe('trackedUser', function() {
  console.log('finished fetching trackedUser');
  Template.users.rendered = function() {
   /*handlign of the template*/


    console.log('users template rendered');
  }

  });

    /*observe geolocation after it is all fetched*/
  Meteor.subscribe('geolocation', function() {
    console.log('finished fetching location');
    /* Obseve the Collection geolocation and trigger event when item inserted or removed  */
    query = Geolocation.find({});
    query.observeChanges({
      added: function(id) {
        addMarkerToMap(id);
        window.map.fitBounds(group.getBounds());
        return;
      }
    });
  });
});

这是我的模板

<template name="users">
<ul id="item-list">  
   {{#each trackedUser}}
    <li id="{{_id}}"> 
        <input type="checkbox" checked /> 
        <span><select name="colorpicker">
                {{#each color}}
                  <option value="{{mColorCode}}" {{selected ../mColor mColorCode}}>{{mColorName}}</option>
                {{/each}}
              </select>
        </span>
        <img width="40"  src="data:image/png;base64,{{mImage}}" />  
        <span class="name">{{mUsername}}</span>
        <p><span class="description">{{mDescription}}</span></p>  
    </li>  
    {{/each}}
</ul>
</template>

谢谢

4

2 回答 2

1

我能够通过在加载页面时向模板内容的定义添加一个条件来解决这个问题,即在加载页面时进行初始同步,并且仅在加载时激活该内容。

之前(服务器发布 300 条记录的 10 秒页面加载):

Template.itemlist.items = function () {
    return Item.find({type: 'car'},
                     {sort: {start: -1},
                      limit: 30});
};

到(服务器发布的 3000 条记录的 2 秒页面加载):

Template.itemlist.items = function () {
    if (Session.get("active")) {    
        return Item.find({type: 'car'},
                         {sort: {start: -1},
                          limit: 30});
    } else {
        return [];
    }
};

为了仅在加载数据后“激活”会话,我添加了:

Deps.autorun(function () {
    Meteor.subscribe("Item", 
                     {
                         onReady: function() {
                             Session.set("active", true);
                         }
                     });
});
于 2013-10-25T20:41:05.577 回答
0

我最近不得不诊断一个流星应用程序的性能问题,发现不是模板的渲染速度很慢,而是服务器和浏览器之间的数据传输。

您可以使用 Chrome 开发者工具来诊断问题。

  1. 打开该工具并确保它正在分析网络流量
  2. 加载您的网站
  3. 检查网络流量。数据是否需要很长时间才能完成进入您的浏览器?

如果数据需要很长时间才能完成到达您的浏览器,那么您可以更深入地了解 websocket 流量:

  1. 过滤 websocket 流量(网络选项卡的底部)
  2. 选择 websocket 请求查看帧
  3. 检查框架中的信息。很多吗?

您可能会发现(正如我所做的那样)您正在向浏览器传输大量不需要渲染模板的信息。

在这种情况下,请确保您已禁用自动发布,然后使用字段说明符仅发布您需要的数据。

于 2013-07-10T18:48:06.867 回答