| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <body> | 3 <body> |
| 4 <script src="../resources/runner.js"></script> | 4 <script src="../resources/runner.js"></script> |
| 5 <script> | 5 <script> |
| 6 var canvas2D = document.createElement("canvas"); | 6 var canvas2D = document.createElement("canvas"); |
| 7 var ctx2D = canvas2D.getContext("2d"); | 7 var ctx2D = canvas2D.getContext("2d"); |
| 8 var canvas3D = document.createElement('canvas'); | 8 var canvas3D = document.createElement('canvas'); |
| 9 var gl = canvas3D.getContext('experimental-webgl'); | 9 var gl = canvas3D.getContext('experimental-webgl'); |
| 10 if (!gl) | 10 if (!gl) |
| 11 PerfTestRunner.log("\nWebGL is not supported or enabled on this platform!\n"
); | 11 PerfTestRunner.log("\nWebGL is not supported or enabled on this platform!\n"
); |
| 12 var MEASURE_DRAW_TIMES = 100; | 12 var MEASURE_DRAW_TIMES = 50; |
| 13 var MAX_COUNT = 60000; | 13 var MAX_MEASURE_DRAW_TIMES = 1000; |
| 14 var count = 0; | 14 var MAX_MEASURE_TIME_PER_FRAME = 1000; // 1 sec |
| 15 | 15 |
| 16 function setSize(canvas2DWidth, canvas2DHeight, webglWidth, webglHeight) { | 16 function setSize(canvas2DWidth, canvas2DHeight, webglWidth, webglHeight) { |
| 17 canvas2D.width = canvas2DWidth; | 17 canvas2D.width = canvas2DWidth; |
| 18 canvas2D.height = canvas2DHeight; | 18 canvas2D.height = canvas2DHeight; |
| 19 canvas3D.width = webglWidth; | 19 canvas3D.width = webglWidth; |
| 20 canvas3D.height = webglHeight; | 20 canvas3D.height = webglHeight; |
| 21 } | 21 } |
| 22 | 22 |
| 23 function rand(range) { | 23 function rand(range) { |
| 24 return Math.floor(Math.random() * range); | 24 return Math.floor(Math.random() * range); |
| 25 } | 25 } |
| 26 | 26 |
| 27 function renderWebGL(gl) { | 27 function renderWebGL(gl) { |
| 28 gl.disable(gl.SCISSOR_TEST); | 28 gl.disable(gl.SCISSOR_TEST); |
| 29 gl.clear(gl.COLOR_BUFER_BIT); | 29 gl.clear(gl.COLOR_BUFER_BIT); |
| 30 gl.enable(gl.SCISSOR_TEST); | 30 gl.enable(gl.SCISSOR_TEST); |
| 31 gl.scissor(rand(1024), rand(1024), rand(1024), rand(1024)); | 31 gl.scissor(rand(1024), rand(1024), rand(1024), rand(1024)); |
| 32 gl.clearColor(Math.random(), Math.random(), Math.random(), 1); | 32 gl.clearColor(Math.random(), Math.random(), Math.random(), 1); |
| 33 gl.clear(gl.COLOR_BUFFER_BIT); | 33 gl.clear(gl.COLOR_BUFFER_BIT); |
| 34 } | 34 } |
| 35 | 35 |
| 36 function drawWebGLToCanvas2D() { | 36 function drawWebGLToCanvas2D() { |
| 37 if (gl) { | 37 if (gl) { |
| 38 var start = PerfTestRunner.now(); | 38 var start = PerfTestRunner.now(); |
| 39 for (var i = 0; i < MEASURE_DRAW_TIMES; i++) { | 39 var count = 0; |
| 40 renderWebGL(gl); | 40 while ((PerfTestRunner.now() - start <= MAX_MEASURE_TIME_PER_FRAME) && (
count * MEASURE_DRAW_TIMES < MAX_MEASURE_DRAW_TIMES)) { |
| 41 // draw dynamic WebGL | 41 for (var i = 0; i < MEASURE_DRAW_TIMES; i++) { |
| 42 ctx2D.drawImage(canvas3D, 0, 0); | 42 renderWebGL(gl); |
| 43 // draw dynamic WebGL |
| 44 ctx2D.drawImage(canvas3D, 0, 0); |
| 45 } |
| 46 count++; |
| 43 } | 47 } |
| 44 // Calling getImageData() is just to flush out the content when | 48 // Calling getImageData() is just to flush out the content when |
| 45 // accelerated 2D canvas is in use. The cost of reading 1x1 pixels is lo
w. | 49 // accelerated 2D canvas is in use. The cost of reading 1x1 pixels is lo
w. |
| 46 ctx2D.getImageData(0, 0, 1, 1); | 50 ctx2D.getImageData(0, 0, 1, 1); |
| 47 count++; | |
| 48 | 51 |
| 49 var elapsedTime = PerfTestRunner.now() - start; | 52 var elapsedTime = PerfTestRunner.now() - start; |
| 50 PerfTestRunner.measureValueAsync(MEASURE_DRAW_TIMES * 1000 / elapsedTime
); | 53 PerfTestRunner.measureValueAsync(MEASURE_DRAW_TIMES * count * 1000 / ela
psedTime); |
| 51 } else | 54 } else |
| 52 PerfTestRunner.measureValueAsync(0); | 55 PerfTestRunner.measureValueAsync(0); |
| 53 if (count < MAX_COUNT) | 56 |
| 54 requestAnimationFrame(drawWebGLToCanvas2D); | 57 requestAnimationFrame(drawWebGLToCanvas2D); |
| 55 } | 58 } |
| 56 | 59 |
| 57 function onCompletedRun() { | 60 function onCompletedRun() { |
| 58 count = MAX_COUNT; | |
| 59 } | 61 } |
| 60 | 62 |
| 61 window.onload = function () { | 63 window.onload = function () { |
| 62 PerfTestRunner.prepareToMeasureValuesAsync({done: onCompletedRun, unit: 'run
s/s', | 64 PerfTestRunner.prepareToMeasureValuesAsync({done: onCompletedRun, unit: 'run
s/s', |
| 63 description: "This bench test checks the speed on drawing dynamic WebGL(
1024x1024) to HW accelerated Canvas2D(1024x1024)."}); | 65 description: "This bench test checks the speed on drawing dynamic WebGL(
1024x1024) to HW accelerated Canvas2D(1024x1024)."}); |
| 64 // It should use setMinimumAccelerated2dCanvasSize() to enable accelerated C
anvas for a specified size | 66 // It should use setMinimumAccelerated2dCanvasSize() to enable accelerated C
anvas for a specified size |
| 65 // but this API is not available in JS or WebPage. Assume the threshold size
is 256x257 | 67 // but this API is not available in JS or WebPage. Assume the threshold size
is 256x257 |
| 66 // and the dest canvas is HW accelerated Canvas when setting its size to 102
4x1024. | 68 // and the dest canvas is HW accelerated Canvas when setting its size to 102
4x1024. |
| 67 setSize(1024, 1024, 1024, 1024); | 69 setSize(1024, 1024, 1024, 1024); |
| 68 if (gl) | 70 if (gl) |
| 69 renderWebGL(gl); | 71 renderWebGL(gl); |
| 70 drawWebGLToCanvas2D(); | 72 drawWebGLToCanvas2D(); |
| 71 } | 73 } |
| 72 | 74 |
| 73 </script> | 75 </script> |
| 74 </body> | 76 </body> |
| 75 </html> | 77 </html> |
| OLD | NEW |