ABCDEFGHIJKLMNOPQRSTUVWX
1
At Filament Group, we were curious about the relative performance of popular MVC frameworks such as Angular, Ember, Backbone, and Polymer. Fortunately, the TodoMVC project implements the same Todo application implemented in most of the popular JavaScript MV* frameworks of today.
2
To benchmark each, we pulled down the TodoMVC code then concatenated files, applied minification, and serve each with gzip to make these closer to 'production ready' so we can measure performance via webpagetest.org. For each framework, we ran five test runs each for Chrome/Cable, Chrome/3G, and Android/3G - each test run is a row in the data set below.
3
The Render Start (Column D) time maps closely to when the Todo UI appears in the test's filmstrip view so that is the primary number to watch for perceived speed. The render start time cells are color-coded into 4 buckets: Dark Green (under 1 second), Green (under 2 seconds), Yellow (under 4 seconds), Red (more than 4 seconds).
4
Read the article: http://www.filamentgroup.com/lab/mv-initial-load-times.html
5
6
Framework and Device/NetworkWeb Page Test Results URL (5 runs per)TTFB (ms)Render Start (ms)Visually Complete (ms)Load TIme (ms)Speed Index
7
Angular 1.3.6 (50.9k of JS)http://104.131.64.176:3000/angularjs/
8
Test runs:
9
Chrome - Cablehttp://www.webpagetest.org/result/141211_58_8V8/84891900432909
10
Chrome - Cablehttp://www.webpagetest.org/result/141211_GV_8V9/847921400387811
11
Chrome - Cablehttp://www.webpagetest.org/result/141211_ZK_8VA/92792800385810
12
Chrome - Cablehttp://www.webpagetest.org/result/141211_FV_8VB/888941400433915
13
Chrome - Cablehttp://www.webpagetest.org/result/141211_NC_8VC/867941400369813
14
Chrome - Cablehttp://www.webpagetest.org/result/141211_7J_8VD/90894900434914
15
Chrome - Cablehttp://www.webpagetest.org/result/141211_D7_8WM/87890900437914
16
Chrome - Cablehttp://www.webpagetest.org/result/141211_J0_8WN/87893900428909
17
Chrome - Cablehttp://www.webpagetest.org/result/141211_90_8WP/978911300392909
18
Chrome - Cablehttp://www.webpagetest.org/result/141211_4T_8ZD/8898810004521011
19
Chrome - Cablehttp://www.webpagetest.org/result/141211_4H_8WR/877931300366820
20
Chrome - Cablehttp://www.webpagetest.org/result/141211_36_8WS/858931500446917
21
Chrome - Cablehttp://www.webpagetest.org/result/141211_Z1_8WT/867921500405821
22
Chrome - Cablehttp://www.webpagetest.org/result/141211_92_8ZE/88794800410810
23
Chrome - Cablehttp://www.webpagetest.org/result/141211_TS_8ZF/85895900399911
24
Chrome - Cablehttp://www.webpagetest.org/result/141211_2B_8ZG/847951300365810
25
Chrome - Cablehttp://www.webpagetest.org/result/141211_EV_8ZH/858921400447909
26
Chrome - Cablehttp://www.webpagetest.org/result/141211_K3_8ZJ/89109311004291111
27
Chrome - Cablehttp://www.webpagetest.org/result/141211_X5_8ZK/10698910005231016
28
Chrome - Cablehttp://www.webpagetest.org/result/141211_WK_8ZM/8299310004821009
29
mean882.4
30
stdev84.55
31
99% conf. interval48.70
32
33
Chrome - 3Ghttp://www.webpagetest.org/result/141211_JQ_92V/6303095310019913115
34
Chrome - 3Ghttp://www.webpagetest.org/result/141211_AV_92W/6302993360020433016
35
Chrome - 3Ghttp://www.webpagetest.org/result/141211_VD_92X/6293091360020473115
36
Chrome - 3Ghttp://www.webpagetest.org/result/141211_SB_92Y/6333190320021623211
37
Chrome - 3Ghttp://www.webpagetest.org/result/141211_3K_92Z/6313094360020483114
38
Chrome - 3Ghttp://www.webpagetest.org/result/141211_X8_932/6283090370020313117
39
Chrome - 3Ghttp://www.webpagetest.org/result/141211_96_933/6372994350020503016
40
Chrome - 3Ghttp://www.webpagetest.org/result/141211_PC_934/6653104310020913110
41
Chrome - 3Ghttp://www.webpagetest.org/result/141211_D9_9SM/6382993300020103017
42
Chrome - 3Ghttp://www.webpagetest.org/result/141211_NF_9SN/6292990350020313016
43
Chrome - 3Ghttp://www.webpagetest.org/result/141211_3V_9SP/6373195370020023215
44
Chrome - 3Ghttp://www.webpagetest.org/result/141211_ZA_9SQ/6293094360020393115
45
Chrome - 3Ghttp://www.webpagetest.org/result/141211_7E_9SR/6533290370020713314
46
Chrome - 3Ghttp://www.webpagetest.org/result/141211_3G_9VR/6333094350020093115
47
Chrome - 3Ghttp://www.webpagetest.org/result/141211_JD_9VS/6472993350020193016
48
Chrome - 3Ghttp://www.webpagetest.org/result/141211_T2_9VT/6282994360019943016
49
Chrome - 3Ghttp://www.webpagetest.org/result/141211_6B_9VW/6302894290019902917
50
Chrome - 3Ghttp://www.webpagetest.org/result/141211_W0_9VX/6313094360020713115
51
Chrome - 3Ghttp://www.webpagetest.org/result/141211_J9_9VY/6423094360020653116
52
Chrome - 3Ghttp://www.webpagetest.org/result/141211_ZY_9VZ/6322995350019853015
53
mean3068.55
54
stdev90.68
55
99% conf. interval52.23
56
57
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_EE_9X9/6643729372923213729
58
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_Y5_BC9/7614451445132644451
59
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_K0_9YP/6943802380223133802
60
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_RD_BH4/6644130413030734130
61
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_F2_9YS/6624230423026534230
62
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_TR_B9N/6614078407826164078
63
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_4W_BCB/6584166416628744166
64
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_7B_ACQ/6574029402926764029
65
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_AZ_ACR/8953593359325823593
66
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_82_ACS/6613842384226323842
67
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_C6_ACT/6633509350925083509
68
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_AC_ACV/6583975397528983975
69
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_CY_ACW/6863534353425813534
70
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_VA_AJ2/9154375437529094375
71
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_ME_AJ3/7834209420927824209
72
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_F2_AJ4/6663777377726113777
73
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_MP_AJ5/6704155415528904155
74
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_QV_AJ6/6634274427430004274
75
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_3G_BCC/7883849384927773849
76
Nexus 5 Chrome - 3Ghttp://www.webpagetest.org/result/141211_NY_AJ8/6784123412331354123
77
mean3991.5
78
stdev275.24
79
99% conf. interval158.53
80
81
Backbone 1.1.2 (42.7k of JS)http://104.131.64.176:3000/backbone/
82
Test runs:
83
Chrome - Cablehttp://www.webpagetest.org/result/141210_GM_BTE/85388500522420
84
Chrome - Cablehttp://www.webpagetest.org/result/141210_2G_BTF/90290500385335
85
Chrome - Cablehttp://www.webpagetest.org/result/141210_3Q_BTG/85293800342329
86
Chrome - Cablehttp://www.webpagetest.org/result/141210_DW_BTH/111392800390434
87
Chrome - Cablehttp://www.webpagetest.org/result/141210_B7_BTJ/82293600409345
88
Chrome - Cablehttp://www.webpagetest.org/result/141210_ET_BTK/87194400329228
89
Chrome - Cablehttp://www.webpagetest.org/result/141210_N0_BTM/88290500403329
90
Chrome - Cablehttp://www.webpagetest.org/result/141210_X6_BTN/85290500451330
91
Chrome - Cablehttp://www.webpagetest.org/result/141210_XS_BTP/93296500472331
92
Chrome - Cablehttp://www.webpagetest.org/result/141210_98_BTQ/84291800400344
93
Chrome - Cablehttp://www.webpagetest.org/result/141210_12_BTR/86290500374334
94
Chrome - Cablehttp://www.webpagetest.org/result/141210_HV_BTS/97294500380330
95
Chrome - Cablehttp://www.webpagetest.org/result/141210_KJ_BTT/86194800391246
96
Chrome - Cablehttp://www.webpagetest.org/result/141210_E1_BTV/88388500412423
97
Chrome - Cablehttp://www.webpagetest.org/result/141210_79_BTW/85193400339237
98
Chrome - Cablehttp://www.webpagetest.org/result/141210_YD_BTX/85194800340237
99
Chrome - Cablehttp://www.webpagetest.org/result/141210_PB_BTY/98293600383342
100
Chrome - Cablehttp://www.webpagetest.org/result/141210_TE_BTZ/86289500444331