{"ScriptPreparationCode":" let image,\r\n imageData,\r\n ctx = new OffscreenCanvas(0, 0).getContext(\u00272d\u0027),\r\n main = document.querySelector(\u0027canvas\u0027),\r\n c = main.getContext(\u00272d\u0027),\r\n width, height,\r\n imageAsBlob,\r\n imageAsBitmap\r\n async function globalMeasureThatScriptPrepareFunction() {\r\n image = await loadImage();\r\n ({width, height} = image)\r\n ctx.canvas.width = main.width = width\r\n ctx.canvas.height = main.height = height\r\n ctx.drawImage(image, 0, 0, width, height)\r\n imageData = ctx.getImageData(0, 0, width, height)\r\n imageAsBlob = await loadImage(URL.createObjectURL(await ctx.canvas.convertToBlob()))\r\n imageAsBitmap = await createImageBitmap(ctx.canvas, 0, 0, width, height)\r\n }\r\n\r\n function loadImage(url = \u0060https://www.measurethat.net/images/Picture1.png\u0060) {\r\n return new Promise(resolve =\u003E {\r\n const img = new Image\r\n img.src = url\r\n img.onload = () =\u003E resolve(img)\r\n })\r\n }\r\n\r\n function clear() {\r\n c.clearRect(0, 0, width, height)\r\n }\r\n const repeatCount = 1\r\n\r\n function test(num) {\r\n switch (num) {\r\n case 1:\r\n for (let n = repeatCount; n--;) {\r\n c.drawImage(image, 0, 0, width, height)\r\n clear()\r\n }\r\n break\r\n case 2:\r\n for (let n = repeatCount; n--;) {\r\n c.putImageData(imageData, 0, 0)\r\n\t\t\t\t clear()\r\n }\r\n break\r\n case 3:\r\n for (let n = repeatCount; n--;) {\r\n c.drawImage(imageAsBlob, 0, 0)\r\n clear()\r\n }\r\n break\r\n case 4:\r\n for (let n = repeatCount; n--;) {\r\n c.drawImage(imageAsBitmap, 0, 0)\r\n clear()\r\n }\r\n break\r\n }\r\n }","TestCases":[{"Name":"draw image directly","Code":"test(1)","IsDeferred":false},{"Name":"putImageData","Code":"test(2)","IsDeferred":false},{"Name":"draw image blob","Code":"test(3)","IsDeferred":false},{"Name":"draw image bitmap","Code":"test(4)","IsDeferred":false}]}