JS Syntax
  • Introduction
  • this
  • block-level scope
  • ===
  • inefficient DOM manipulation
  • Reference equality, shallow equality and deep equality
  • D3 - 2
  • D3 - 5
  • D3 - static
Powered by GitBook
On this page

Was this helpful?

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.

Previous===NextReference equality, shallow equality and deep equality

Last updated 5 years ago

Was this helpful?