我和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"
}