javascript-重新創建pinterest，例如網格

Question

我正在創建一個像pinterest這樣的網格，除了在代碼中獲取項目的高度太慢之外，其他所有工作都很好。
在我的代碼中，我必須獲取最后添加的元素的高度並將其添加到行的高度，因此對於下一個項目，我可以將頂部位置設置為該高度。
這是代碼：

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;
            }
        },

但是問題是，除了獲取元素的高度之外，此過程非常快。
因此在不獲取高度的情況下，該功能大約需要20毫秒
但是獲取高度會增加75ms的時間，使其大約95ms
現在我的問題是，我怎樣才能更快地確定高度？

Answer 1

添加完第一輪圖塊之后，您可以存儲不同行的高度。因此，下一次在您添加新圖塊時，它將可用，而無需計算或等待為了它。