SVG Dots Stress Test

by samih

HTML

<svg id="svg" xmlns="http://www.w3.org/2000/svg" version="1.1">
  <rect width="2" height="2" style="fill:rgb(0,0,0);" />
</svg>

JavaScript

var svg = document.getElementById('svg');
for (var i=0; i<1000; i++){
    var shape = document.createElementNS("http://www.w3.org/2000/svg", "rect");
    shape.setAttributeNS(null, "width", 2);
    shape.setAttributeNS(null, "height", 2);
    shape.setAttributeNS(null, "fill", "black");
    shape.setAttributeNS(null, "x", i*2);
    shape.setAttributeNS(null, "y", i%20 * 2);
    svg.appendChild(shape);
}