inefficient DOM manipulation

Adding multiple DOM elements one by one is inefficient.

One effective alternative is to use document fragments.

var div = document.getElementsByTagName("my_div");

var fragment = document.createDocumentFragment();
for (var e = 0; e < elems.length; e++) {  // elems previously set to list of elements
    fragment.appendChild(elems[e]);
}

div.appendChild(fragment.cloneNode(true));

Creating attached DOM elements is expensive.

You should create and modify them while detached and then attaching them.

Last updated

Was this helpful?