Ver índice de contenidos del libro

9.2. Añadir nuevo contenido por fuera de un bucle

Si va a insertar muchos elementos en el DOM, hágalo todo de una sola vez, no de una por vez.

// mal
$.each(myArray, function(i, item) {
   var newListItem = '<li>' + item + '</li>';
   $('#ballers').append(newListItem);
});
 
// mejor: realizar esto
var frag = document.createDocumentFragment();
$.each(myArray, function(i, item) {
    var newListItem = '<li>' + item + '</li>';
    frag.appendChild(newListItem);
});
$('#ballers')[0].appendChild(frag);
 
// o esto:
var myHtml = '';
$.each(myArray, function(i, item) {
    myHtml += '<li>' + item + '</li>';
});
$('#ballers').html(myHtml);