perf.html
2.3 KB
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
76
77
78
79
80
81
82
83
84
85
86
87
88
89
<!doctype html>
<html>
<head>
<title>MPEG-TS Parser Performance Workbench</title>
<!-- video.js -->
<script src="../node_modules/video.js/video.dev.js"></script>
<!-- HLS plugin -->
<script src="../src/video-js-hls.js"></script>
<script src="../src/flv-tag.js"></script>
<script src="../src/exp-golomb.js"></script>
<script src="../src/h264-stream.js"></script>
<script src="../src/aac-stream.js"></script>
<script src="../src/segment-parser.js"></script>
<!-- MPEG-TS segment -->
<script src="tsSegment-bc.js"></script>
<style>
.desc {
background-color: #ddd;
border: thin solid #333;
padding: 8px;
}
</style>
</head>
<body>
<p class="desc">Select your number of iterations and then press "Run" to begin parsing MPEG-TS packets into FLV tags. This page can be handy for identifying segment parser performance bottlenecks.</p>
<form>
<input name="iterations" min="1" type="number" value="1">
<button type="sumbit">Run</button>
</form>
<table>
<thead>
<th>Iterations</th><th>Time</th><th>kB / second</th>
</thead>
<tbody class="results"></tbody>
</table>
<script>
var
button = document.querySelector('button'),
input = document.querySelector('input'),
results = document.querySelector('.results'),
reportResults = function(count, elapsed) {
var
row = document.createElement('tr'),
countCell = document.createElement('td'),
elapsedCell = document.createElement('td'),
throughputCell = document.createElement('td');
countCell.innerText = count;
elapsedCell.innerText = elapsed;
throughputCell.innerText = ((bcSegment.byteLength * count) / elapsed) / 1024;
row.appendChild(countCell);
row.appendChild(elapsedCell);
row.appendChild(throughputCell);
results.insertBefore(row, results.firstChild);
};
button.addEventListener('click', function(event) {
var
iterations = input.value,
parser = new window.videojs.hls.SegmentParser(),
start;
// setup
start = +new Date();
while (iterations--) {
// parse the segment
parser.parseSegmentBinaryData(window.bcSegment);
// finalize all the FLV tags
while (parser.tagsAvailable()) {
parser.getNextTag();
}
}
// report
reportResults(input.value, (+new Date()) - start);
// don't actually submit the form
event.preventDefault();
}, false);
</script>
</body>
</html>