{"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":"fillRect/concat","Code":"for (var i=500;i--;){\r\nvar px = $pxls[$i\u002B\u002B % 10000];\r\n$ctx.fillStyle = \u0027rgba(\u0027 \u002B px.r \u002B \u0027,\u0027 \u002B px.g \u002B \u0027,\u0027 \u002B px.b \u002B \u0027,\u0027 \u002B (px.a / 255) \u002B \u0027)\u0027;\r\n$ctx.fillRect(px.x, px.y, 1, 1);\r\n}","IsDeferred":false},{"Name":"fillRect/optimized further","Code":"const alphmult = 1 / 255\r\nfor (let i=500;--i;){\r\nconst px = $pxls[\u002B\u002B$i % 10000];\r\n$ctx.fillStyle = \u0060rgba(${px.r},${px.g},${px.b},${px.a * alphmult})\u0060;\r\n$ctx.fillRect(px.x, px.y, 1, 1);\r\n}","IsDeferred":false}]}