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 |