{"ScriptPreparationCode":"\r\nvar blob = new Blob([\r\n\u0060\r\n let bitmap = undefined;\r\n let canvas = undefined;\r\n let ctx = undefined;\r\n let buffer = undefined;\r\n\r\nlet postAMessage=self.postMessage;\r\n\r\nfunction render()\r\n{\r\n\t\tctx.clearRect(0,0,640,480);\r\n\t\tctx.drawImage(bitmap, 0,0);\r\n\t\trequestAnimationFrame(render);\r\n}\r\n\r\nself.onmessage = function(ev) {\r\n\r\n\r\n\r\n if(ev.data.msg === \u0027bitmap\u0027 \u0026\u0026 canvas != undefined) {\r\n\t\tbitmap = ev.data.imageB;\r\n\t\tconsole.log(\u0022Received an ImageBitmap next!\u0022);\r\n\t\trender();\r\n }\r\n\r\n if(ev.data.msg === \u0027init\u0027 \u0026\u0026 bitmap != undefined) {\r\n canvas = ev.data.canvas;\r\n ctx = canvas.getContext(\u00272d\u0027);\r\n\tconsole.log(\u0022Received a canvas next!\u0022);\r\n\trender();\r\n\r\n }\r\n\r\n if(ev.data.msg === \u0027bitmap\u0027 \u0026\u0026 canvas == undefined) {\r\n\tconsole.log(\u0022Received a bitmap first!\u0022);\r\n\t\r\n\t\tbitmap = ev.data.imageB;\r\n }\r\n\r\n if(ev.data.msg === \u0027init\u0027 \u0026\u0026 bitmap == undefined) {\r\n\tconsole.log(\u0022Received a canvas first!\u0022);\r\n\t\r\n canvas = ev.data.canvas;\r\n ctx = canvas.getContext(\u00272d\u0027);\r\n\r\n }\r\n if(ev.data.msg === \u0027buffer\u0027) {\r\n\tconsole.log(\u0022Clearing buffer \u0022 \u002B ev.data.msgIndex \u002B \u0022from pool\u0022);\r\n\r\n \tself.postMessage({msg:\u0027buffer\u0027,msgIndex:ev.data.msgIndex});\r\n }\r\n}\r\n\u0060]);\r\n\r\nvar myWorker = new Worker(window.URL.createObjectURL(blob));\r\nvar buff = new ArrayBuffer(100);\r\nvar buffers = [];\r\n\r\n//create a pool of buffers\r\nfor (let i = 0; i \u003C 30; i\u002B\u002B)\r\n{\r\nbuffers.push(new ArrayBuffer(100));\r\nbuffers[i].isUsed = false;\r\n}\r\n\r\nvar img = new Image();\r\n\r\nfunction handleMessageFromWorker(msg) {\r\n console.log(\u0027the thread used buffer: \u0027 \u002B msg.data.msgIndex);\r\n\tif (msg.data.msg == \u0022buffer\u0022)\r\n {\r\n buffers[parseInt(msg.data.msgIndex)] = new ArrayBuffer(100);\r\n buffers[parseInt(msg.data.msgIndex)].isUsed = false;\r\n }\r\n}\r\n\r\nmyWorker.addEventListener(\u0027message\u0027, handleMessageFromWorker);\r\n\r\nimg.src = \u0022https://www.google.com/s2/favicons?domain=www.google.com\u0022;\r\n\r\nimg.decode().then(() =\u003E {createImageBitmap(img).then(Ibitmap =\u003E { myWorker.postMessage({imageB: Ibitmap, msg:\u0027bitmap\u0027}, [Ibitmap]); })});\r\n\r\nvar canvas = document.createElement(\u0022canvas\u0022);\r\nvar c2 = document.createElement(\u0022canvas\u0022);\r\nc2.width = 640;\r\nc2.height = 480;\r\nc2 = c2.transferControlToOffscreen();\r\n\r\ncanvas.width = 640;\r\ncanvas.height = 480;\r\nc2.width = 640;\r\nc2.height = 480;\r\n\r\nvar ctx = canvas.getContext(\u00272d\u0027);\r\n\r\nmyWorker.postMessage({msg: \u0027init\u0027, canvas: c2}, [c2]);\r\n\r\n\r\n","TestCases":[{"Name":"drawImage Main Thread","Code":"if (img.width \u003E 0){\r\nctx.drawImage(img, 0, 0);\r\nctx.clearRect(0,0,640,480);\r\n}","IsDeferred":false},{"Name":"drawImage Worker Thread, String","Code":"if (img.width \u003E 0) myWorker.postMessage(\u0022255,0,0\u0022);","IsDeferred":false},{"Name":"drawImage Worker Thread, ArrayBuffer StructuredClone","Code":"if (img.width \u003E 0) myWorker.postMessage(buff);","IsDeferred":false},{"Name":"drawImage Worker Thread, ArrayBuffer Transferable","Code":"if (img.width \u003E 0) { let buffersFull = true; for (let i = 0; i \u003C buffers.length; i\u002B\u002B) { if (!buffers[i].isUsed) {myWorker.postMessage({msg:\u0027buffer\u0027, msgIndex:i, buffer:buffers[i]},[buffers[i]]); buffers[i].isUsed = true; buffersFull = false;} }if (buffersFull) console.log(\u0022All buffers in the pool are full\u0022)}","IsDeferred":false}]}