Представьте себе, есть более крупный веб-сайт, который принимает взаимодействия с пользователем и должен показывать много новых элементов и удалять другие, когда пользователь нажимает куда-то.
Могут ли существенные различия в производительности этих двух подходов?
помещая все в строку:
var x = document.getElementByID("x");
x.innerHTML = "<div><div><span>...</span><div>...</div></div></div>"`
написание иерархии следующим образом:
var a = document.createElement("div");
var b = document.createElement("div");
var c = document.createElement("span");
// ...
a.appendChild(b)
b.appendChild(c)
// ...
var x = document.getElementByID("x");
document.body.insertBefore(a, x);