Does margin-left:2px; render faster than margin:0 0 0 2px;?
- by Christopher Altman
Douglas Crockford describes the consequence of Javascript inquiring a node's style. How simply asking for the margin of a div causes the browser to 'reflow' the div in the browser's rendering engine four times.
So that made me wonder, during the initial rendering of a page (or in Crockford's jargon a "web scroll") is it faster to write CSS that defines only the non-zero/non-default values? To provide an example:
div{
margin-left:2px;
}
Than
div{
margin:0 0 0 2px;
}
I know consequence of this 'savings' is insignificant, but I think it is still important to understand how the technologies are implemented. Also, this is not a question about formatting CSS--this is a question about the implementations of browsers rendering CSS.
Reference: http://developer.yahoo.com/yui/theater/video.php?v=crockonjs-4