| OLD | NEW |
| (Empty) |
| 1 <img id="png"/> | |
| 2 <img id="jpeg-high"/> | |
| 3 <img id="jpeg-low"/> | |
| 4 <img id="webp-high"/> | |
| 5 <img id="webp-low"/> | |
| 6 <script id="myWorker" type="text/worker"> | |
| 7 self.onmessage = function (e) { | |
| 8 var offCanvas = new OffscreenCanvas(50, 50); | |
| 9 var gl = offCanvas.getContext('webgl'); | |
| 10 gl.clearColor(0, 1, 0, 1); | |
| 11 gl.clear(gl.COLOR_BUFFER_BIT); | |
| 12 | |
| 13 offCanvas.convertToBlob() | |
| 14 .then(function(blob) { | |
| 15 self.postMessage({version: "png", data:blob}); | |
| 16 }); | |
| 17 | |
| 18 offCanvas.convertToBlob({type: "image/jpeg"}) | |
| 19 .then(function(blob) { | |
| 20 self.postMessage({version: "jpeg-high", data:blob}); | |
| 21 }); | |
| 22 | |
| 23 offCanvas.convertToBlob({type: "image/jpeg", quality: 0.2}) | |
| 24 .then(function(blob) { | |
| 25 self.postMessage({version: "jpeg-low", data:blob}); | |
| 26 }); | |
| 27 | |
| 28 offCanvas.convertToBlob({type: "image/webp"}) | |
| 29 .then(function(blob) { | |
| 30 self.postMessage({version: "webp-high", data:blob}); | |
| 31 }); | |
| 32 | |
| 33 offCanvas.convertToBlob({type: "image/webp", quality: 0.2}) | |
| 34 .then(function(blob) { | |
| 35 | |
| 36 self.postMessage({version: "webp-low", data:blob}); | |
| 37 }); | |
| 38 } | |
| 39 </script> | |
| 40 <script> | |
| 41 if (window.testRunner) { | |
| 42 testRunner.waitUntilDone(); | |
| 43 } | |
| 44 | |
| 45 var pngImage = document.getElementById('png'); | |
| 46 var jpegImageHigh = document.getElementById('jpeg-high'); | |
| 47 var jpegImageLow = document.getElementById('jpeg-low'); | |
| 48 var webpImageHigh = document.getElementById('webp-high'); | |
| 49 var webpImageLow = document.getElementById('webp-low'); | |
| 50 var numTestCount = 5; | |
| 51 function imageLoaded() { | |
| 52 numTestCount--; | |
| 53 if (numTestCount == 0 && window.testRunner) { | |
| 54 window.testRunner.notifyDone(); | |
| 55 } | |
| 56 } | |
| 57 pngImage.addEventListener('load', imageLoaded); | |
| 58 jpegImageHigh.addEventListener('load', imageLoaded); | |
| 59 jpegImageLow.addEventListener('load', imageLoaded); | |
| 60 webpImageHigh.addEventListener('load', imageLoaded); | |
| 61 webpImageLow.addEventListener('load', imageLoaded); | |
| 62 | |
| 63 var workerBlob = new Blob([document.getElementById('myWorker').textContent]); | |
| 64 var worker = new Worker(URL.createObjectURL(workerBlob)); | |
| 65 worker.addEventListener("message", function(msg) { | |
| 66 var blob = msg.data.data; | |
| 67 switch (msg.data.version) { | |
| 68 case 'png': | |
| 69 pngImage.src = URL.createObjectURL(blob); | |
| 70 break; | |
| 71 case 'jpeg-high': | |
| 72 jpegImageHigh.src = URL.createObjectURL(blob); | |
| 73 break; | |
| 74 case 'jpeg-low': | |
| 75 jpegImageLow.src = URL.createObjectURL(blob); | |
| 76 break; | |
| 77 case 'webp-high': | |
| 78 webpImageHigh.src = URL.createObjectURL(blob); | |
| 79 break; | |
| 80 case 'webp-low': | |
| 81 webpImageLow.src = URL.createObjectURL(blob); | |
| 82 break; | |
| 83 } | |
| 84 }); | |
| 85 worker.postMessage(""); | |
| 86 </script> | |
| 87 | |
| OLD | NEW |