src/tools/perf/page_sets/tough_canvas_cases/many_images/single_image.html

   1 <html>
   2 <head>
   3 <title>Canvas - Single Image</title>
   4 <style>
   5   #sprite-cache {
   6     visibility: hidden;
   7   }
   8 </style>
   9 <script type="text/javascript" src="bench.js"></script>
  10 <script type="text/javascript" src="sprites.js"></script>
  11 <script type="text/javascript">
  12 window.onload = init;
  13
  14 var NUM_SPRITES = 2000;
  15 var canvas;
  16 var context;
  17
  18 function init() {
  19   canvas = document.getElementById('canvas');
  20   context = canvas.getContext('2d');
  21
  22   sprites.init(canvas.width, canvas.height);
  23   var image = document.getElementById('sprite-cache').children[0];
  24   for (var i = 0; i < NUM_SPRITES; ++i) {
  25     sprites.add(image);
  26   };
  27
  28   bench.run(draw);
  29 };
  30
  31 function draw() {
  32   context.clearRect(0, 0, canvas.width, canvas.height);
  33   sprites.draw(context);
  34 };
  35 </script>
  36 </head>
  37
  38 <body>
  39   <canvas id="canvas" width="800" height = "600">
  40   <div id="sprite-cache">
  41     <img src="images/image1_t.png" />
  42   </div>
  43 </body>
  44 </html>