Q:

javascript - recreation of pinterest like grid

I'm creating a grid like pinterest 
and everything is working fine except that getting the height of items in the code is too slow.
in my code, I have to get the height of last added element and add it to the height of the row, so for the next item I can set the top position to the height.
here's the code:
testOne: function(itemArray, parent){
            // layout
            var layout = [];
            for(i in itemArray_){
                var item = itemArray[i];
                var template = this.template(item);
                // get smallest height
                var smallestHeight = layout[0];
                var smallestHeightRow = 0;
                for(i in layout){if(layout[i] < smallestHeight){smallestHeight = layout[i]; smallestHeightRow = i;}}
                // add item to screen
                parent.append(template);
                // add height of last item
                var item = parent.find("[item-id="+item._id+"]");
                item.css("top", smallestHeight+15+"px");
                item.css("left", smallestHeightRow*25+"%");
                var itemHeight = item[0].offsetHeight;
                layout[smallestHeightRow] = smallestHeight+itemHeight;
            }
        },

but the problem is, this process is fast except for getting the height of the element.
so without getting the height, the function takes about 20ms
but getting the height adds another 75ms to the process and makes it about 95ms
now my question is, how can I make the determination of the height a lot faster?

A:

You can store the heights of different rows after you are done with adding the first round of tiles.. So that for the next time when you are adding new tiles it will be available to you and you don't have to compute it or wait for it.

