灰烬慢视图渲染 - >显示加载状态或提高速度

时间:2014-05-20 11:50:50

标签: ember.js

我和Ember一起创造纸牌游戏。 每当玩家进入游戏时,Ember会渲染玩家购买的所有牌,并确定是否已经按照这样的方式滚动了一个号码:

App.NumberController = Ember.ObjectController.extend({
    needs: ['game'],
    drawnNumbers: Ember.computed.alias('controllers.game.drawnNumbers'),
    isActive: function () {
        var item, drawnNumbers;

        item = this.get('model');
        drawnNumbers = this.get('drawnNumbers');

        return drawnNumbers.indexOf(item) !== -1;
    }.property('model', 'drawnNumbers')
});


App.GameController = Ember.ObjectController.extend({
    ownBingoCards: function () {
        var gameId, userId;
        gameId = this.get('id');
        userId = this.get('session.content.id');

        return this.get('store').filter('bingoCard', function (bingoCard) {
            return (bingoCard.get('game.id') === gameId && bingoCard.get('user.id') === userId);
        });
    }.property('model.bingoCards', 'session.content'),
})



// view
{{#each bingoCard in ownBingoCards}}
    <div class="col-sm-4">
        <div class="table-responsive">
            <span class="label label-primary">Card {{bingoCard.id}}</span>
            <table class="table table-bordered table-card">
                <tbody>
                {{#each row in bingoCard.squares}}
                <tr>
                    {{#each number in row itemController='number'}}
                        {{#if number}}
                            <td {{bind-attr class='isActive:active'}}>{{number.model}}</td>
                        {{else}}
                            <td>X</td>
                        {{/if}}
                    {{/each}}
                </tr>
                {{/each}}
                </tbody>
            </table>
        </div>
    </div>
{{/each}}

此视图渲染大约需要5秒钟。无论如何都要提出这个观点

一个。渲染得更快? 要么 湾显示加载状态?

请注意,所有这些数据都已加载,主要是渲染bingocards需要花费大量时间。

编辑:

这是宾果游戏的json:

{
  "bingoCards": [
    {
      "id": "537a33bc98045a6f28287af8",
      "createdAt": "2014-05-19T16:39:24.718Z",
      "updatedAt": "2014-05-19T16:39:24.718Z",
      "game": "537a33ad98045a6f28287af6",
      "user": "5378758fb39d096d1ee842f6",
      "squares": [
        [
          2,
          8,
          15,
          7,
          10
        ],
        [
          20,
          28,
          26,
          23,
          30
        ],
        [
          40,
          42,
          0,
          32,
          33
        ],
        [
          46,
          53,
          51,
          52,
          57
        ],
        [
          74,
          62,
          66,
          71,
          63
        ]
      ]
    },
    {
      "id": "537a33c298045a6f28287afa",
      "createdAt": "2014-05-19T16:39:30.997Z",
      "updatedAt": "2014-05-19T16:39:30.997Z",
      "game": "537a33ad98045a6f28287af6",
      "user": "5378758fb39d096d1ee842f6",
      "squares": [
        [
          11,
          1,
          2,
          6,
          10
        ],
        [
          22,
          23,
          26,
          17,
          16
        ],
        [
          31,
          38,
          0,
          41,
          37
        ],
        [
          58,
          59,
          54,
          52,
          57
        ],
        [
          66,
          75,
          72,
          73,
          67
        ]
      ]
    },
    {
      "id": "537a33de98045a6f28287afc",
      "createdAt": "2014-05-19T16:39:58.976Z",
      "updatedAt": "2014-05-19T16:39:58.976Z",
      "game": "537a33ad98045a6f28287af6",
      "user": "5378758fb39d096d1ee842f6",
      "squares": [
        [
          15,
          14,
          10,
          4,
          2
        ],
        [
          21,
          27,
          16,
          30,
          17
        ],
        [
          38,
          33,
          0,
          36,
          31
        ],
        [
          51,
          60,
          58,
          47,
          55
        ],
        [
          70,
          73,
          67,
          74,
          69
        ]
      ]
    },
    {
      "id": "537a342a9042848528424c7a",
      "createdAt": "2014-05-19T16:41:14.149Z",
      "updatedAt": "2014-05-19T16:41:14.149Z",
      "game": "537a33ad98045a6f28287af6",
      "user": "5378758fb39d096d1ee842f6",
      "squares": [
        [
          12,
          6,
          14,
          7,
          13
        ],
        [
          27,
          18,
          19,
          26,
          21
        ],
        [
          34,
          33,
          0,
          43,
          32
        ],
        [
          60,
          53,
          47,
          51,
          57
        ],
        [
          61,
          69,
          68,
          73,
          71
        ]
      ]
    },
    {
      "id": "537a34419042848528424c7c",
      "createdAt": "2014-05-19T16:41:37.470Z",
      "updatedAt": "2014-05-19T16:41:37.470Z",
      "game": "537a33ad98045a6f28287af6",
      "user": "5378758fb39d096d1ee842f6",
      "squares": [
        [
          5,
          11,
          1,
          13,
          6
        ],
        [
          25,
          27,
          29,
          26,
          16
        ],
        [
          43,
          37,
          0,
          34,
          32
        ],
        [
          54,
          48,
          60,
          57,
          50
        ],
        [
          65,
          67,
          72,
          61,
          62
        ]
      ]
    },
    {
      "id": "537a349c6b459a9928d99993",
      "createdAt": "2014-05-19T16:43:08.491Z",
      "updatedAt": "2014-05-19T16:43:08.491Z",
      "game": "537a33ad98045a6f28287af6",
      "user": "5378758fb39d096d1ee842f6",
      "squares": [
        [
          10,
          1,
          7,
          3,
          2
        ],
        [
          27,
          16,
          28,
          18,
          26
        ],
        [
          45,
          43,
          0,
          37,
          38
        ],
        [
          57,
          46,
          60,
          53,
          58
        ],
        [
          73,
          65,
          71,
          64,
          66
        ]
      ]
    },
    {
      "id": "537a34f96b459a9928d99995",
      "createdAt": "2014-05-19T16:44:41.069Z",
      "updatedAt": "2014-05-19T16:44:41.069Z",
      "game": "537a33ad98045a6f28287af6",
      "user": "5378758fb39d096d1ee842f6",
      "squares": [
        [
          15,
          4,
          8,
          13,
          14
        ],
        [
          23,
          21,
          16,
          28,
          19
        ],
        [
          45,
          42,
          0,
          31,
          35
        ],
        [
          57,
          51,
          46,
          52,
          50
        ],
        [
          73,
          72,
          69,
          71,
          64
        ]
      ]
    },
    {
      "id": "537a36142144b3af2841fd56",
      "createdAt": "2014-05-19T16:49:24.137Z",
      "updatedAt": "2014-05-19T16:49:24.137Z",
      "game": "537a33ad98045a6f28287af6",
      "user": "5378758fb39d096d1ee842f6",
      "squares": [
        [
          5,
          12,
          11,
          1,
          7
        ],
        [
          28,
          22,
          18,
          30,
          17
        ],
        [
          45,
          41,
          0,
          37,
          36
        ],
        [
          59,
          51,
          47,
          54,
          56
        ],
        [
          66,
          68,
          71,
          75,
          61
        ]
      ]
    },
    {
      "id": "537a382fdd5a333529f02872",
      "createdAt": "2014-05-19T16:58:23.473Z",
      "updatedAt": "2014-05-19T16:58:23.473Z",
      "game": "537a33ad98045a6f28287af6",
      "user": "5378758fb39d096d1ee842f6",
      "squares": [
        [
          1,
          5,
          3,
          14,
          12
        ],
        [
          25,
          22,
          27,
          21,
          17
        ],
        [
          37,
          34,
          0,
          32,
          43
        ],
        [
          52,
          51,
          58,
          56,
          47
        ],
        [
          61,
          71,
          65,
          72,
          74
        ]
      ]
    },
    {
      "id": "537a382fdd5a333529f02874",
      "createdAt": "2014-05-19T16:58:23.910Z",
      "updatedAt": "2014-05-19T16:58:23.910Z",
      "game": "537a33ad98045a6f28287af6",
      "user": "5378758fb39d096d1ee842f6",
      "squares": [
        [
          4,
          3,
          7,
          1,
          9
        ],
        [
          18,
          21,
          20,
          19,
          17
        ],
        [
          41,
          40,
          0,
          36,
          44
        ],
        [
          55,
          52,
          48,
          51,
          60
        ],
        [
          62,
          72,
          75,
          70,
          65
        ]
      ]
    },
    {
      "id": "537a3830dd5a333529f02876",
      "createdAt": "2014-05-19T16:58:24.097Z",
      "updatedAt": "2014-05-19T16:58:24.097Z",
      "game": "537a33ad98045a6f28287af6",
      "user": "5378758fb39d096d1ee842f6",
      "squares": [
        [
          11,
          7,
          10,
          13,
          2
        ],
        [
          28,
          22,
          18,
          21,
          25
        ],
        [
          32,
          38,
          0,
          40,
          33
        ],
        [
          48,
          47,
          59,
          56,
          58
        ],
        [
          66,
          65,
          67,
          63,
          69
        ]
      ]
    },
    {
      "id": "537a3830dd5a333529f02878",
      "createdAt": "2014-05-19T16:58:24.112Z",
      "updatedAt": "2014-05-19T16:58:24.112Z",
      "game": "537a33ad98045a6f28287af6",
      "user": "5378758fb39d096d1ee842f6",
      "squares": [
        [
          1,
          11,
          8,
          3,
          12
        ],
        [
          27,
          28,
          23,
          24,
          22
        ],
        [
          38,
          34,
          0,
          44,
          35
        ],
        [
          54,
          50,
          49,
          60,
          53
        ],
        [
          68,
          75,
          70,
          66,
          72
        ]
      ]
    },
    {
      "id": "537a3830dd5a333529f0287a",
      "createdAt": "2014-05-19T16:58:24.343Z",
      "updatedAt": "2014-05-19T16:58:24.343Z",
      "game": "537a33ad98045a6f28287af6",
      "user": "5378758fb39d096d1ee842f6",
      "squares": [
        [
          14,
          9,
          1,
          2,
          10
        ],
        [
          19,
          30,
          17,
          28,
          21
        ],
        [
          43,
          33,
          0,
          35,
          36
        ],
        [
          59,
          54,
          60,
          52,
          56
        ],
        [
          70,
          63,
          71,
          73,
          69
        ]
      ]
    },
    {
      "id": "537a3830dd5a333529f0287c",
      "createdAt": "2014-05-19T16:58:24.402Z",
      "updatedAt": "2014-05-19T16:58:24.402Z",
      "game": "537a33ad98045a6f28287af6",
      "user": "5378758fb39d096d1ee842f6",
      "squares": [
        [
          9,
          11,
          12,
          6,
          15
        ],
        [
          29,
          26,
          20,
          27,
          24
        ],
        [
          37,
          41,
          0,
          44,
          33
        ],
        [
          48,
          50,
          56,
          49,
          58
        ],
        [
          70,
          75,
          73,
          72,
          67
        ]
      ]
    },
    {
      "id": "537a3830dd5a333529f0287e",
      "createdAt": "2014-05-19T16:58:24.443Z",
      "updatedAt": "2014-05-19T16:58:24.443Z",
      "game": "537a33ad98045a6f28287af6",
      "user": "5378758fb39d096d1ee842f6",
      "squares": [
        [
          11,
          15,
          6,
          5,
          1
        ],
        [
          25,
          21,
          24,
          19,
          20
        ],
        [
          45,
          38,
          0,
          43,
          40
        ],
        [
          47,
          49,
          60,
          48,
          54
        ],
        [
          64,
          70,
          72,
          62,
          75
        ]
      ]
    },
    {
      "id": "537a3830dd5a333529f02880",
      "createdAt": "2014-05-19T16:58:24.839Z",
      "updatedAt": "2014-05-19T16:58:24.839Z",
      "game": "537a33ad98045a6f28287af6",
      "user": "5378758fb39d096d1ee842f6",
      "squares": [
        [
          7,
          3,
          4,
          10,
          9
        ],
        [
          20,
          27,
          21,
          23,
          17
        ],
        [
          34,
          43,
          0,
          41,
          32
        ],
        [
          51,
          47,
          54,
          59,
          57
        ],
        [
          65,
          72,
          70,
          68,
          74
        ]
      ]
    }
  ],
  "winners": [],
  "messages": [],
  "table": {
    "minimumPlayers": 2,
    "maximumPlayers": 100,
    "maximumCards": 10,
    "cardPrice": 1000,
    "tableType": "beginner",
    "id": "537a33ad98045a6f28287af5",
    "createdAt": "2014-05-19T16:39:09.322Z",
    "updatedAt": "2014-05-19T16:39:09.322Z"
  },
  "gameStatus": "idle",
  "serverSeed": "hCH2WtCin(%$sUXqaKFp_F#CFu)R(=fi!wzPxy^WVzT5NF0pkhNFw9%#l!@yKhl_",
  "pattern": [
    [
      1,
      1,
      1,
      1,
      1
    ],
    [
      1,
      0,
      0,
      0,
      1
    ],
    [
      1,
      0,
      0,
      0,
      1
    ],
    [
      1,
      0,
      0,
      0,
      1
    ],
    [
      1,
      1,
      1,
      1,
      1
    ]
  ],
  "numbers": [
    1,
    2,
    3,
    4,
    5,
    6,
    7,
    8,
    9,
    10,
    11,
    12,
    13,
    14,
    15,
    16,
    17,
    18,
    19,
    20,
    21,
    22,
    23,
    24,
    25,
    26,
    27,
    28,
    29,
    30,
    31,
    32,
    33,
    34,
    35,
    36,
    37,
    38,
    39,
    40,
    41,
    42,
    43,
    44,
    45,
    46,
    47,
    48,
    49,
    50,
    51,
    52,
    53,
    54,
    55,
    56,
    57,
    58,
    59,
    60,
    61,
    62,
    63,
    64,
    65,
    66,
    67,
    68,
    69,
    70,
    71,
    72,
    73,
    74,
    75
  ],
  "drawnNumbers": [],
  "createdAt": "2014-05-19T16:39:09.368Z",
  "updatedAt": "2014-05-19T16:39:09.368Z",
  "id": "537a33ad98045a6f28287af6"
}

0 个答案:

没有答案