关于documentFragment优化DOM渲染的关键笔记

重新翻阅javascript文档看到一个应该挺重要但是之前遗漏掉的方法

document.createDocumentFragment();　　

DocumentFragment不属于当前文档，因此基于对它进行改动，都不会引发网页的重新渲染，这样比直接操作当前文档DOM的性能表现自然更优。

当然需要提一下 createDocumentFragment方法生成一个DocumentFragment对象，这个对象是一个存在于内存的DOM片段。

贴一下大致用法：

 

var ele = document.createDocumentFragment();

[a, b, c, d].forEach(function(e) {
  var li = document.createElement("li");
  li.textContent = e;
  ele.appendChild(li);
});

document.body.appendChild(ele);