性能：动态脚本注入与服务器呈现脚本

Question

从性能角度来看，我想了解从服务器加载一段JS代码（选项＃1）与在客户端加载同一段代码（选项＃2）之间的区别。

选项＃1： 服务器在标记中发送JS代码。

选项＃2： 服务器将代码作为JS字符串（var jsCode = '[code]'）发送出去。在浏览器上，触发加载后，将创建一个脚本节点并设置.text属性（scriptNode.text = jsCode）

scriptNode = document.createElement('script');
document.body.appendChild(scriptNode);
scriptNode.setAttribute('type', 'text/javascript');
scriptNode.text = jsCode;

从绩效角度来看，一种选择比其他选择更好吗？例如，在选项＃2中，我们需要完成创建脚本节点并将其添加到DOM树的额外工作。除了这些之外还有任何不同的表现（时间和记忆）？

Answer 1

除非有一些我不知道的魔法，否则我认为选项2不可能更快 - 你仍然通过网络发送相同数量的数据，你仍在解析一个脚本块，你甚至通过修改DOM（当然使用一些内存）来增加额外的步骤。

但是，如果以异步方式加载脚本，则选项2 中可能会出现感知性能提升，因为这不会像内联一样在解析期间阻止页面呈现脚本块会。