У меня проблемы с производительностью динамически создаваемого многоуровневого списка с помощью jquery. Я получаю свои данные через JSON с сервера, а затем отрисовываю их на стороне клиента с помощью:
for (var i = 0; i < myArray.length; i++){
var subArr = myArray[i];
var newElm = "<li id="+subArr.node_order+" value="+subArr.id+" class='list-item'><span>"+subArr.node_name+"</span><ul></ul></li>";
var parent = $("li#"+subArr.parent_id+" ul");
if(parent[0] != undefined){
$(parent[0]).append(newElm);
} else{
sortable.html("<ul>"+newElm+"</ul>");
}
}
В списке может быть до 15 000 элементов списка 'li'. Приблизительно с 6500 объектами данные извлекаются с сервера в течение ок. 1,5 секунды, но на это уходит около 4,4 секунды, чтобы построить и нарисовать список. Это самый быстрый из всех, что я видел, но 11k + предметов - это нормально. Я также хочу свести к минимуму любые плагины, потому что этот список является перетаскиваемым и довольно динамичным, поэтому перетаскивание не активируется до тех пор, пока не наведется указатель мыши на «span».
Любой указатель высоко ценится!