/
perf-6-header-tags-10-list-items.html
66 lines (56 loc) · 1.95 KB
/
perf-6-header-tags-10-list-items.html
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
<!DOCTYPE html>
<html>
<head>
<title>Transparency perf test</title>
<script src="lib/benchmark.js"></script>
<script src="lib/weld.js"></script>
<script src="lib/handlebars-1.0.0.beta.6.js"></script>
<script src="lib/jquery-1.7.1.min.js"></script>
<script src="lib/coffee-script.js"></script>
<script src="../dist/transparency.js"></script>
</head>
<body>
<div>
<pre id="result"></pre>
</div>
<h4>Transparency</h4>
<div id="transparency">
<h1 class='header'></h1>
<h2 class='header2'></h2>
<h3 class='header3'></h3>
<h4 class='header4'></h4>
<h5 class='header5'></h5>
<h6 class='header6'></h6>
<ul class='list'>
<li class='item'></li>
</ul>
</div>
<h4>Handlebars</h4>
<div id="handlebars">
</div>
<script type="text/coffeescript">
sharedVariables =
header: "Header",
header2: "Header2",
header3: "Header3",
header4: "Header4",
header5: "Header5",
header6: "Header6",
list: ['10000000', '2', '3', '4', '5', '6', '7', '8', '9', '10']
results = $("#result")
transparencyTemplate = $("#transparency")[0]
handlebarsOutput = $("#handlebars")[0]
handlebarsTemplate = Handlebars.compile("<div><h1 class='header'>{{header}}</h1><h2 class='header2'>{{header2}}</h2><h3 class='header3'>{{header3}}</h3><h4 class='header4'>{{header4}}</h4><h5 class='header5'>{{header5}}</h5><h6 class='header6'>{{header6}}</h6><ul class='list'>{{#list}}<li class='item'>{{this}}</li>{{/list}}</ul></div>")
new Benchmark.Suite()
.add("transparency", ->
Transparency.render transparencyTemplate, sharedVariables, list: item: text: -> @value)
.add("handlebars", ->
handlebarsOutput.innerHTML = handlebarsTemplate sharedVariables)
.on("cycle", (event, bench) ->
$("#result").append String(bench) + '\n')
.on("complete", ->
$("#result").append "Fastest is " + @filter("fastest").pluck("name"))
.run true
</script>
</body>
</html>