Back in the early 2000s, I was obsessed with performance tweaks – it was then that I first realized that writing massive numbers of elements with javascript was actually faster than having them written as markup – and when I learned that absolutely positioned elements were more quickly rendered than static or relatively positioned elements. The latter makes some sense – the browser doesn’t have to measure as it encounters new elements further down the page, or re-position (and potentially re-size) previously rendered ones.

For reasons too obscure to mention, today I was testing the fastest way to render 129,600 individual elements in a grid (each 1px tall and wide, to form a rectangle). After having a couple browsers barf on me using absolute positioning, and results of 5-10 seconds when reducing the quantity by factors of half, I remembered good old table-layout: fixed. The result: about 250ms in gecko, 750 in webkit – for the full lot.

Also interesting, but not as surprising, the JS itself took virtually no time – by using while loops and running from the top of the stack down, I got consistent results of less than 20ms in most tests.