DOM离线化

1.使用display控制显隐，临时将要操作的元素从文档流中脱离，然后再恢复它

	let el = document.getElementById('el');
	el.style.display = 'none';
	// 对 el 进行操作...
	el.style.display = 'block'

2.使用 createDocumentFragment，创建文档片段，操作后一次性把文档片段添加到文档流中（缓存批量化dom操作）。

	let fragment = document.createDocumentFragment()
	// 在 fragment 上进行一系列操作...
	document.getElementById('el').appendChild(fragment)

3.创建节点副本，在副本上进行操作，最后进行替换。

	let el = document.getElementById('el');
	let clone = el.cloneNode(true);
	// 对 clone 节点进行操作...
	el.parentNode.replaceChild(clone, el);

上面所述也是渲染层面的一种优化策略，减少页面的回流重绘。