chrome/test/data/media/html/mixed_audio_latency_perf.html

   1 <!DOCTYPE html>
   2 <html>
   3   <head>
   4     <title>Mixed-Audio Loop Benchmark</title>
   5     <style>* { font-family: monospace; }</style>
   6   </head>
   7   <body>
   8     <h1>Mixed-Audio Loop Benchmark </h1>
   9     <p>
  10       Benchmark measuring how fast we can continuously repeat a short sound
  11       clip, while another clip is running in the background. In the ideal
  12       scenario we'd have zero latency processing script, seeking back to the
  13       beginning of the clip, and resuming audio playback.
  14     </p>
  15
  16     <button onclick="startTest();">Start</button>
  17
  18     <p>
  19       Times Played: <span id="times"></span></span><br>
  20       Clip Duration: <span id="clip"></span></span><br>
  21       Ideal Duration: <span id="ideal"></span><br>
  22       Actual Duration: <span id="actual"></span><br>
  23       Average Latency: <span id="average"></span><br>
  24     </p>
  25
  26     <script>
  27       // Total time to run the the test is approximately:
  28       // TIMES x (shortclip_duration + latency) =~ 50 x (140 + 50) = 9500ms.
  29       // The background clip should last long enough till the test is finished.
  30       // So a 20sec background clip should be sufficient.
  31       var TIMES = 50, averageLatency = 0;
  32
  33       function getAndClearElement(id) {
  34         var elem = document.getElementById(id);
  35         elem.innerText = '';
  36         return elem;
  37       }
  38
  39       function startTest() {
  40         var timesElem = getAndClearElement('times');
  41         var clipElem = getAndClearElement('clip');
  42         var idealElem = getAndClearElement('ideal');
  43         var actualElem = getAndClearElement('actual');
  44         var averageElem = getAndClearElement('average');
  45         var buttonElem = document.querySelector('button');
  46
  47         var loopCount = 0, idealDuration = 0, actualDuration = 0;
  48         var startTime;
  49
  50         buttonElem.disabled = true;
  51
  52         function onLoaded() {
  53           idealDuration = Math.round(audio.duration * TIMES * 1000, 0);
  54           idealElem.innerText =  idealDuration + ' ms';
  55           clipElem.innerText = Math.round(audio.duration * 1000, 0) + ' ms';
  56           audio.addEventListener('seeked', onLoop);
  57           startTime = window.performance.now();
  58           audio.play();
  59         }
  60
  61         startBackgroundClip();
  62         var audio = document.createElement('audio');
  63         audio.addEventListener('canplaythrough', onLoaded);
  64         audio.loop = true;
  65         audio.src = '../pink_noise_140ms.wav';
  66
  67         function onLoop() {
  68           ++loopCount;
  69           timesElem.innerText = loopCount + '/' + TIMES;
  70           if (loopCount == TIMES) {
  71             actualDuration = window.performance.now() - startTime;
  72             actualElem.innerText = actualDuration + ' ms';
  73             buttonElem.disabled = false;
  74
  75             averageLatency = (actualDuration - idealDuration) / loopCount;
  76             averageElem.innerText = averageLatency + ' ms';
  77
  78             // Let the PyAuto test know we're done testing.
  79             if (window.domAutomationController)
  80               window.domAutomationController.send(true);
  81
  82             audio.pause();
  83           }
  84         }
  85       }
  86
  87       function startBackgroundClip() {
  88         var audio = document.createElement('audio');
  89         audio.src = '../avperf/pink_noise_20s.wav';
  90         audio.play();
  91       }
  92     </script>
  93   </body>
  94 </html>