Performance, improving page load about 40% faster

client/components/cards/checklists.jade

@@ -92,7 +92,7 @@ template(name="editChecklistItemForm")
         | {{_ 'convertChecklistItemToCardPopup-title'}}
 
 template(name="checklistItems")
-  if checklist.items.count
+  if checklist.items.length
     if canModifyCard
       +inlinedForm(autoclose=false classNames="js-add-checklist-item" checklist = checklist position="top")
         +addChecklistItemForm(checklist=checklist showNewlineBecomesNewChecklistItem=true)

client/components/cards/minicard.jade

@@ -156,7 +156,7 @@ template(name="minicard")
           .badge
             span.badge-icon.fa.fa-paperclip
             span.badge-text= attachments.length
-      if checklists.count
+      if checklists.length
         .badge(class="{{#if checklistFinished}}is-finished{{/if}}")
           span.badge-icon.fa.fa-check-square-o
           span.badge-text.check-list-text {{checklistFinishedCount}}/{{checklistItemCount}}

models/cards.js

@@ -7,7 +7,7 @@ import {
 } from '../config/const';
 import Attachments, { fileStoreStrategyFactory } from "./attachments";
 import { copyFile } from './lib/fileStoreStrategy.js';
-
+import { DataCache } from 'meteor-reactive-cache';
 
 Cards = new Mongo.Collection('cards');
 
@@ -808,27 +808,30 @@ Cards.helpers({
   },
 
   checklists() {
-    if (this.isLinkedCard()) {
-      return Checklists.find({ cardId: this.linkedId }, { sort: { sort: 1 } });
-    } else {
-      return Checklists.find({ cardId: this._id }, { sort: { sort: 1 } });
+    if (!this._checklists) {
+      let id = this._id;
+      if (this.isLinkedCard()) {
+        id = this.linkedId;
+      }
+      this._checklists = new DataCache(() => Checklists.find({ cardId: id }, { sort: { sort: 1 } }).fetch(), 1000);
     }
+    return this._checklists.get();
   },
 
   firstChecklist() {
-    const checklists = this.checklists().fetch();
+    const checklists = this.checklists();
     const ret = _.first(checklists);
     return ret;
   },
 
   lastChecklist() {
-    const checklists = this.checklists().fetch();
+    const checklists = this.checklists();
     const ret = _.last(checklists);
     return ret;
   },
 
   checklistItemCount() {
-    const checklists = this.checklists().fetch();
+    const checklists = this.checklists();
     return checklists
       .map(checklist => {
         return checklist.itemCount();
@@ -839,7 +842,7 @@ Cards.helpers({
   },
 
   checklistFinishedCount() {
-    const checklists = this.checklists().fetch();
+    const checklists = this.checklists();
     return checklists
       .map(checklist => {
         return checklist.finishedCount();

models/checklists.js

@@ -1,3 +1,5 @@
+import { DataCache } from 'meteor-reactive-cache'
+
 Checklists = new Mongo.Collection('checklists');
 
 /**
@@ -81,42 +83,44 @@ Checklists.helpers({
   },
 
   itemCount() {
-    return ChecklistItems.find({ checklistId: this._id }).count();
+    const ret = this.items().length;
+    return ret;
   },
   items() {
-    return ChecklistItems.find(
-      {
-        checklistId: this._id,
-      },
-      { sort: ['sort'] },
-    );
+    if (!this._items) {
+      this._items = new DataCache(() => ChecklistItems.find(
+        {
+          checklistId: this._id,
+        },
+        { sort: ['sort'] },
+
+      )
+      .fetch()
+      , 1000);
+    }
+    return this._items.get();
   },
   firstItem() {
-    const allItems = this.items().fetch();
-    const ret = _.first(allItems);
+    const ret = _.first(this.items());
     return ret;
   },
   lastItem() {
-    const allItems = this.items().fetch();
-    const ret = allItems[allItems.length - 1];
+    const ret = _.last(this.items());
     return ret;
   },
   finishedCount() {
-    return ChecklistItems.find({
-      checklistId: this._id,
-      isFinished: true,
-    }).count();
+    const ret = this.items().filter(_item => _item.isFinished).length;
+    return ret;
   },
   /** returns the finished percent of the checklist */
   finishedPercent() {
-    const checklistItems = ChecklistItems.find({ checklistId: this._id });
-    const count = checklistItems.count();
-    const checklistItemsFinished = checklistItems.fetch().filter(checklistItem => checklistItem.isFinished);
+    const count = this.itemCount();
+    const checklistItemsFinished = this.finishedCount();
 
     let ret = 0;
 
     if (count > 0) {
-      ret = Math.round(checklistItemsFinished.length / count * 100);
+      ret = Math.round(checklistItemsFinished / count * 100);
     }
     return ret;
   },