1<html>
2<head><title>WebKit video playback statistics</title></head>
3<body>
4<!-- inspired by --
5  -- http://people.mozilla.org/~cpearce/paint-stats-demo.html -->
6<video src="http://movies.apple.com/movies/us/apple/ipoditunes/2007/touch/ads/apple_ipodtouch_touch_r640-9cie.mov" id="v" controls autoplay></video>
7<div id="log">
8    Audio bytes decoded: 0 average p/s: 0<br>
9    Video bytes decoded: 0 average p/s: 0<br>
10    Decoded frames: 0 average p/s: 0<br>
11    Dropped frames: 0 average p/s: 0<br>
12</div>
13<script>
14
15var decodedFrames = 0;
16var decodedPerSec = 0;
17var audioBytesDecoded = 0;
18var audioBytesDecodedPerSec = 0;
19var videoBytesDecoded = 0;
20var videoBytesDecodedPerSec = 0;
21var droppedFrames = 0;
22var droppedFramesPerSec = 0;
23
24function Mean() {
25  this.count = 0;
26  this.sum = 0;
27  
28  this.record = function(val) {
29    this.count++;
30    this.sum += val;
31  };
32  
33  this.mean = function() {
34    return this.count ? (this.sum / this.count).toFixed(3) : 0;
35  };
36}
37
38
39var decodedMean = new Mean();
40var audioMean = new Mean();
41var videoMean = new Mean();
42var dropMean = new Mean();
43
44function recalcRates() {
45  var v = document.getElementById("v");
46
47  if (v.readyState <= HTMLMediaElement.HAVE_CURRENT_DATA || v.paused) {
48    return;
49  }
50
51  decodedPerSec = (v.webkitDecodedFrameCount - decodedFrames);
52  decodedFrames = v.webkitDecodedFrameCount;
53
54  audioBytesDecodedPerSec = v.webkitAudioDecodedByteCount - audioBytesDecoded;
55  audioBytesDecoded = v.webkitAudioDecodedByteCount;
56
57  videoBytesDecodedPerSec = v.webkitVideoDecodedByteCount - videoBytesDecoded;
58  videoBytesDecoded = v.webkitVideoDecodedByteCount;
59
60  droppedFramesPerSec = v.webkitDroppedFrameCount - droppedFrames;
61  droppedFrames = v.webkitDroppedFrameCount;
62
63  decodedMean.record(decodedPerSec);
64  audioMean.record(audioBytesDecodedPerSec);
65  videoMean.record(videoBytesDecodedPerSec);
66  dropMean.record(droppedFramesPerSec);
67  
68  var d = document.getElementById("log");
69  d.innerHTML =
70        "Audio bytes decoded: " + v.webkitAudioDecodedByteCount + " average p/s: " + audioMean.mean() + "<br>" +
71        "Video bytes decoded: " + v.webkitVideoDecodedByteCount + " average p/s: " + videoMean.mean() + "<br>" +
72        "Decoded frames: " + v.webkitDecodedFrameCount + " average p/s: " + decodedMean.mean() + "<br>" +
73        "Dropped frames: " + v.webkitDroppedFrameCount + " average p/s: " + dropMean.mean() + "<br>";
74}
75
76setInterval(recalcRates, 1000);
77</script>
78</body>
79</html>
80