Inefficient DOM control

JavaScript makes it generally simple to control the DOM (i.e., include, alter, and expel components), yet does nothing to advance doing as such effectively.

A typical case is code that includes a progression of DOM Elements each one in turn. Including a DOM component is a costly operation. Code that includes various DOM components continuously is wasteful and likely not to function admirably.

One viable option when various DOM components should be added is to utilize report sections rather, subsequently enhancing both productivity and execution.

For instance: 

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));

Notwithstanding the naturally enhanced proficiency of this approach, making appended DOM components is costly, though making and altering them while disengaged and afterward joining them yields much better execution.