{"ScriptPreparationCode":"$c = document.getElementById(\u0027c\u0027);\r\n$ctx = $c.getContext(\u00272d\u0027);\r\n$ctx.clearRect(0, 0, 800, 300);\r\n$px = $ctx.createImageData(1, 1);\r\n$pxls = [];\r\nfor (var i=0; i\u003C10000; \u002B\u002Bi) $pxls.push({\r\n x: Math.random() * 800 \u003C\u003C 0,\r\n y: Math.random() * 300 \u003C\u003C 0,\r\n r: Math.random() * 255 \u003C\u003C 0,\r\n g: Math.random() * 255 \u003C\u003C 0,\r\n b: Math.random() * 255 \u003C\u003C 0,\r\n a: Math.random() * 128 \u003C\u003C 0 \u002B 128\r\n});\r\n$i = 0;","TestCases":[{"Name":"Typed Array canvas image manipulation","Code":"for (var i=500;i--;){\r\n\tvar canvasWidth = $c.width;\r\n\tvar canvasHeight = $c.height;\r\n \tvar imageData = $ctx.getImageData(0, 0, canvasWidth, canvasHeight);\r\n \tvar buf = new ArrayBuffer(imageData.data.length);\r\n\tvar buf8 = new Uint8ClampedArray(buf);\r\n\tvar data = new Uint32Array(buf);\r\n \tfor (var y = 0; y \u003C canvasHeight; \u002B\u002By) {\r\n \tfor (var x = 0; x \u003C canvasWidth; \u002B\u002Bx) {\r\n \tvar value = x * y \u0026 0xff;\r\n\r\n data[y * canvasWidth \u002B x] =\r\n (255 \u003C\u003C 24) | // alpha\r\n (value \u003C\u003C 16) | // blue\r\n (value \u003C\u003C 8) | // green\r\n value; // red\r\n }\r\n }\r\n\r\n\timageData.data.set(buf8);\r\n\r\n\t$ctx.putImageData(imageData, 0, 0);\r\n}","IsDeferred":false},{"Name":"Conventional canvas Image manipulation","Code":"for (var i=500;i--;){\r\n\tvar canvasWidth = $c.width;\r\n\tvar canvasHeight = $c.height;\r\n \tvar imageData = $ctx.getImageData(0, 0, canvasWidth, canvasHeight);\r\n \tvar data = imageData.data;\r\n \tfor (var y = 0; y \u003C canvasHeight; \u002B\u002By) {\r\n \tfor (var x = 0; x \u003C canvasWidth; \u002B\u002Bx) {\r\n var index = (y * canvasWidth \u002B x) * 4;\r\n var value = x * y \u0026 0xff;\r\n data[index] = value;\t// red\r\n data[\u002B\u002Bindex] = value;\t// green\r\n data[\u002B\u002Bindex] = value;\t// blue\r\n data[\u002B\u002Bindex] = 255;\t// alpha\r\n }\r\n }\r\n \t$ctx.putImageData(imageData, 0, 0);\r\n}","IsDeferred":false}]}