html页面与js添加的页面区别,在可预见的情况下，直接写好html元素和用js插入html元素对比？...

起因，写了两个html页面，body中只有div块，将div个数从1百加到1千后在浏览器中调试显示加载时间DOMContentLoaded:50ms左右(两者区别不大)，加到1万后，页面1显示500ms左右，页面2显示100ms左右。

求解：在可预见的情况下，直接写好html元素和用js插入html元素在各方面的对比。

页面1：html>

..........

.......

....

页面2：html>

for(var i=0;i<9999;i++){

var div = document.createElement("div");

var node = document.createTextNode("hello world");

div.appendChild(node);

var element =document.getElementById('div1');

element.appendChild(div);

}