Test name | Executions per second |
---|---|
Single - opacity - setAttribute - opacity | 164.8 Ops/sec |
Single - opacity - style.opacity | 200.0 Ops/sec |
Group - opacity - setAttribute - Fill | 401.2 Ops/sec |
Group - opacity - style.opacity | 378.8 Ops/sec |
<svg>
<rect id="foo" w="10px" h="10px" fill="none" stroke="#C60" stroke-width="1px" />
<rect id="bar" w="10px" h="10px" fill="none" stroke="#C60" stroke-width="1px" />
<g id="group">
<rect w="10px" h="10px" fill="none" stroke="#CCC" stroke-width="1px" />
<rect w="10px" h="10px" fill="none" stroke="#CCC" stroke-width="1px" />
</g>
</svg>
var elementA = document.getElementById("foo");
var elementB = document.getElementById("bar");
var elementGroup = document.getElementById("group");
var i = 10000;
while (i--) {
elementA.setAttribute("opacity", i);
elementB.setAttribute("opacity", i);
}
var i = 10000;
while (i--) {
elementA.style.opacity = i;
elementB.style.opacity = i;
}
var i = 10000;
while (i--) {
elementGroup.setAttribute("opacity", i);
}
var i = 10000;
while (i--) {
elementGroup.style.opacity = i;
}