Den*_*gin 6 html javascript browser asynchronous pagespeed
问题是如何重写静态 HTML 脚本嵌入：
\n<script async id="__script__id__"\n type="text/javascript"\n src="//abc.xyz.com/js/script.js">\n</script>\n到编程嵌入中，该嵌入允许仅在特定条件下加载脚本。
\n悬赏金是为了描述静态/程序化嵌入之间的差异而设置的，具体来说：
\nsrc通过权威参考解释将脚本嵌入从 HTML 内联转换为程序化如何影响浏览器优化（众所周知，浏览器会扫描带有属性的 HTML 脚本标签并预加载它们）。Our*_*rus 16
如果您已经弄清楚如何检测您的条件，则加载另一个脚本如下所示：
<head>
<!-- the usual head stuff goes here -->
<script>
// replace `criteria` with your actual criteria
if(criteria) {
const script = document.createElement('script');
script.id = '__script__id__';
script.type = 'text/javascript';
script.async = true;
script.src = '//abc.xyz.com/js/script.js';
document.head.append(script);
}
</script>
<!-- remaining scripts go here -->
<!-- injected script will end up here -->
</head>
检查条件，创建元素，设置其属性，将其添加到文档中。
我尝试寻找有关此机制的详细信息。我能找到的最好的内容来自 MDN 关于脚本元素async和defer属性的主题：
这些属性的确切处理细节很复杂，涉及 HTML 的许多不同方面，因此分散在整个规范中。这些算法描述了核心思想，但它们依赖于HTML、外部内容和XML中
<script>开始和结束标记的解析规则；该方法的规则；脚本的处理；等等。document.write()
不幸的是，我对 W3 的各种 HTML 规范没有必要的熟悉程度，无法将其变成简单的英语，而且看起来需要相当多的时间才能熟悉。