0acf0d03 by David LaPalomento

Add performance test page

Created a page that runs the segment parser repeatedly on the bunnies test segment. Initial testing indicates garbage parseTSPacket and garbage collection take up about a quarter of the parse run.
1 parent 89d286d1
1 <!doctype html>
2 <html>
3 <head>
4 <title>MPEG-TS Parser Performance Workbench</title>
5 <!-- video.js -->
6 <script src="../node_modules/video.js/video.dev.js"></script>
7
8 <!-- HLS plugin -->
9 <script src="../src/video-js-hls.js"></script>
10 <script src="../src/flv-tag.js"></script>
11 <script src="../src/exp-golomb.js"></script>
12 <script src="../src/h264-stream.js"></script>
13 <script src="../src/aac-stream.js"></script>
14 <script src="../src/segment-parser.js"></script>
15
16 <!-- MPEG-TS segment -->
17 <script src="tsSegment-bc.js"></script>
18 <style>
19 .desc {
20 background-color: #ddd;
21 border: thin solid #333;
22 padding: 8px;
23 }
24 </style>
25 </head>
26 <body>
27 <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>
28 <form>
29 <input name="iterations" min="1" type="number" value="1">
30 <button type="sumbit">Run</button>
31 </form>
32 <table>
33 <thead>
34 <th>Iterations</th><th>Time</th>
35 </thead>
36 <tbody class="results"></tbody>
37 </table>
38 <script>
39 var
40 button = document.querySelector('button'),
41 input = document.querySelector('input'),
42 results = document.querySelector('.results'),
43
44 reportResults = function(label, elapsed) {
45 var
46 row = document.createElement('tr'),
47 labelCell = document.createElement('td'),
48 elapsedCell = document.createElement('td');
49
50 labelCell.innerText = label;
51 elapsedCell.innerText = elapsed
52 row.appendChild(labelCell);
53 row.appendChild(elapsedCell);
54
55 results.insertBefore(row, results.firstChild);
56 };
57
58 button.addEventListener('click', function(event) {
59 var
60 iterations = input.value,
61 parser = new window.videojs.hls.SegmentParser(),
62 start;
63 console.log(iterations);
64
65 // setup
66 start = +new Date();
67
68 while (iterations--) {
69
70 // parse the segment
71 parser.parseSegmentBinaryData(window.bcSegment);
72
73 // finalize all the FLV tags
74 while (parser.tagsAvailable()) {
75 parser.getNextTag();
76 }
77 }
78
79 // report
80 reportResults(input.value, (+new Date()) - start);
81
82 // don't actually submit the form
83 event.preventDefault();
84 }, false);
85 </script>
86 </body>
87 </html>