1 <!DOCTYPE html> 2 <html> 3 <body> 4 <script src="../resources/runner.js"></script> 5 <script> 6 7 var canvas2D = document.createElement("canvas"); 8 var ctx2D = canvas2D.getContext("2d"); 9 var canvas3D = document.createElement('canvas'); 10 var gl = canvas3D.getContext('experimental-webgl'); 11 if(!gl) 12 PerfTestRunner.log("\nWebGL is not supported or enabled on this platform!\n"); 13 var MEASURE_DRAW_TIMES = 1000; 14 var MAX_COUNT = 60000; 15 var count = 0; 16 17 function setSize(width, height) { 18 canvas2D.width = width; 19 canvas2D.height = height; 20 canvas3D.width = width; 21 canvas3D.height = height; 22 } 23 24 function rand(range) { 25 return Math.floor(Math.random() * range); 26 } 27 28 function fillCanvas(ctx2d, canvas2d) { 29 ctx2d.fillStyle = "rgba(" + rand(255) + "," + rand(255) + "," + rand(255) + "," + rand(255) + ")"; 30 ctx2d.fillRect(0, 0, canvas2d.width, canvas2d.height); 31 } 32 33 function uploadCanvas2DToWebGLTexture() { 34 if (gl) { 35 var tex = gl.createTexture(); 36 gl.bindTexture(gl.TEXTURE_2D, tex); 37 38 var start = PerfTestRunner.now(); 39 for (var i = 0; i < MEASURE_DRAW_TIMES; i++) { 40 gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, canvas2D); 41 } 42 gl.readPixels(0, 0, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, new Uint8Array(4)); 43 gl.deleteTexture(tex); 44 count++; 45 46 var elapsedTime = PerfTestRunner.now() - start; 47 PerfTestRunner.measureValueAsync(MEASURE_DRAW_TIMES * 1000 / elapsedTime); 48 } else 49 PerfTestRunner.measureValueAsync(0); 50 if (count < MAX_COUNT) 51 requestAnimationFrame(uploadCanvas2DToWebGLTexture); 52 } 53 54 function onCompletedRun() { 55 count = MAX_COUNT; 56 } 57 58 window.onload = function () { 59 PerfTestRunner.prepareToMeasureValuesAsync({done: onCompletedRun, unit: 'runs/s', 60 description: "This bench test checks the speed on uploading 2d Canvas(1024x1024) to Webgl Texture(1024x1024)."}); 61 setSize(1024, 1024); 62 fillCanvas(ctx2D, canvas2D); 63 uploadCanvas2DToWebGLTexture(); 64 } 65 66 </script> 67 </body> 68 </html> 69
