在我的Web应用程序中，我想完全避免使用html并仅使用javascript来创建网页的dom树。
什么是在html <div>Some text</div>中使用传统方式编写Web内容或使用javascript dom渲染更快，如下所示：div.appendChild(document.createTextNode("Some text"));？
坚持使用传统的HTML。它不仅比使用javascript完成所有操作更快，而且更易于维护。
除非有其他令人信服的理由，否则请坚持使用直接的HTML并使用javascript来获取应用程序的更多互动内容。
恕我直言我认为编译javascript是一个很好的解决方案，可以创建快速的Web应用程序。
（对于2010年，正确的答案可能是正确的）。这是2019年基准测试的答案。
生成具有嵌套div的表，总共500行，250k表格单元格，每个表格单元格10个嵌套div。
<!-- Pure HTML by server -->
<html>
<head></head>
<body>
<table>
<?php
for($i = 0; $i < 500; ++$i) {
echo '<tr>';
for($j = 0; $j < 500; ++$j) {
echo '<td><div><div><div><div><div><div><div><div><div><div>' . $i . '/' . $j . '</div></div></div></div></div></div></div></div></div></div></td>';
}
echo '</tr>';
}
?>
</table>
<script>
alert('finish');
</script>
</body>
</html>
以下由JS生成的HTML：
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<script>
$(document).ready(function() {
var html = '<table>';
for(var i = 0; i < 500; ++i) {
html += '<tr>';
for(var j = 0; j < 500; ++j) {
html += '<td><div><div><div><div><div><div><div><div><div><div>' + i + '/' + j + '</div></div></div></div></div></div></div></div></div></div></td>';
}
html += '</tr>';
}
html += '</table>';
$('body').html(html);
alert('finish');
});
</script>
</body>
</html>
| Download Size | Time 'til browser stops loading
--------------------------------------------------------------------------
Pure HTML by server | 680,000 bytes | 00:01:48
HTML generated by JS | 570 bytes | 00:00:28
在Ubuntu 18上的Chrome v70上进行了测试。
由于许多原因（通常用于可读/可维护的代码），始终坚持使用普通HTML，除非您正在处理大量HTML，否则您可以考虑通过JS生成它。
正如你我想知道的那样，并做了类似于@evilReiko的测试：
为了呈现包含具有1000000000条记录的表的页面，我发现了以下结果：
速度是正确性的次要问题 - 即，首先满足功能要求，然后在必要时快速（有些地方，它可能已经足够快）。
在这种情况下，使用静态标记与JavaScript的决定是谁在使用您的文档的问题 - 是否只有启用了JavaScript的用户？如果是这样，那就没关系了。你需要考虑搜索引擎吗？残疾用户？没有完整JS支持的瘦客户端，或者禁用JS的偏执用户？在所有这些后一种情况下，使用语义标记，而不是用多余的元素混乱，用JavaScript增强，是唯一正确的方法。
传统的方法会更快，因为浏览器只需要下载，解释和显示。您建议的方法将导致浏览器必须下载，解释，更改* n次然后显示。
这就像渲染一样。
就可维护性而言，你正在制造一场噩梦。这是发展的关键。可维护性的噩梦数量与代码的“质量”成正比，恕我直言。性能和优化应该是可维护性的第二位。 （当然也有例外。没有什么是黑白的）。
HTML被创建为一种富有表现力的语言。 Javascript不是。在我看来，故事的结尾。
HTML由浏览器解析并生成，然后输入DOM。使用javascript逐个操作dom是更多的开销。
想象一下，如果你不得不从杂志上重新输入一篇文章。现在想象一下如果每个句子都在新页面上的话。尽管最终结果是复制的文章，但您必须花费所有时间来翻页。
到目前为止，传统方式更快，用户下载文件，它在那里，解析和完成。
如果你使用JS方式，页面必须在客户端构建，每次加载页面。
这只是构建页面恕我直言的一种可怕方式，也是管理/更新/创建的噩梦
如果您要通过javascript对html进行大量更改，我建议使用像trimpath这样的模板库。
我觉得有趣的是你会考虑纯粹通过Javascript创建一个文档。使用DOM和document.createElement创建元素实际上比使用.innerHTML属性更快。此方法直接创建文档对象，而使用innerHTML则需要解析器迭代HTML并创建元素。
另一方面，使用Javascript而不是直接编写HTML将需要解析和执行Javascript，从而在HTML解析器上产生额外的开销。
我已经尝试过为ajax聊天做一个100％javascript构建的组件。事实证明，它的可维护性较差，花费了更多的时间来编写代码，并且优势非常渺茫，甚至很难实现，这可能是一个可以从javascript DOM方法中受益匪浅的项目。
即使你认为可能有优势，也没有。坚持纯HTML。