Bootstrap-4 个脚本最佳位置和脚本标签
Bootstrap-4 scripts best location and scripts' tags
一个有很多讨论的老话题...
我读了很多但仍然不确定...
找到 bootstrap-4 JS 脚本以获得最佳性能的最佳位置和最佳脚本标签 (defer/async) 是什么？
在 Bootstrap 文档中：“将以下 s 放在页面末尾附近，在 body 结束标记
之前
</body>
他们不使用任何脚本标签 (defer/async)
我阅读了脚本标签，
有些人写道，在 body 结束标记之前定位脚本就像定位带有 "defer" 标记的标题一样。 （旧浏览器除外）
有人说 "performance would be better if the scripts are still at the end, as they will be downloaded later"
下面是最佳实践吗？？？
在 body 结束标记之前定位 jquery/popper/bootstrap，首先 jquery 并使用延迟到 popper.min.js 和 bootstrap.min.js?
<body>
......
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script defer src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" ></script>
</body>
或者只是像 bootstrap 文档中那样不带 "defer" 标签？？
最好放在最后，你甚至可以在主体关闭后编写脚本：html 从顶部加载到按钮，当浏览器到达它下载的脚本元素时（并等待）源，所以如果你把它放在最后，页面将加载，然后 js 将被下载。请记住，需要 js 才能使视图动态化，因此在加载页面之前，您不需要以下功能：单击 dropdwon 并查看其内容。 Defer/async只是实现相同结果的一种方法，但并不完全相同。
Head 用于外部资源
最佳做法是在文档开头排除所有依赖项。 <head> 正是为此而生。由于 DOM 在页面加载时未加载，因此所有对 DOM 的引用都将失败。曾经有一段（黑暗的）时间，在延迟之前，通常会得到建议将脚本包含放在 </body> 之后但在 </html>.
之前
但是如果脚本资源确实是在header中加载的，那么有一些更好的解决方案可以解决这个问题：
事件处理程序
一个技巧是等待 DOM 加载 DOMContentloaded event handler。该事件将在 DOM 加载并准备就绪后立即触发。这可以与 async 结合使用以加快页面加载的感知速度。
推迟
很长一段时间以来，可以将 JavaScript 的执行推迟到页面加载之后。 script src= 上的属性 defer 将按引用顺序对 JavaScript 进行排队。
异步
属性async不一定会在页面加载后执行脚本，它只是提示浏览器不要等待下载和执行JavaScript（块）而是与页面呈现并行执行。加载顺序不保证。
这适用于 JavaScript 中不直接依赖于页面内容或其他资源的业务逻辑。 (https://javascript.info/script-async-defer)。包括 bootstrap.min.js 和 async 很可能无法产生预期的结果。
WordPress
目前，但这很可能会改变，如果没有诡计，WordPress 不会延迟 JavaScripts。您可以依靠插件来做到这一点，或者 add a simple function 到您的 functions.php
内联JavaScript
如果 JavaScript 不是从 src 文件中读取而是直接包含 defer 和 async 将被忽略。如果内联 JavaScript 需要等待 DOM 加载，要么使用事件侦听器，要么确实将 <script></script> 放在之后但之前（如果代码在 [=24 之后，大多数浏览器都可以=]. html5 <html>-标签实际上是可选的)
Bootstrap
回答你的问题：对我来说，我不清楚为什么 Bootstrap 不在他们的脚本中使用或记录 defer 的使用。最后，他们甚至摆脱了对 jQuery 的依赖，所以我看不出为什么他们仍然 document 那样。
一个有很多讨论的老话题... 我读了很多但仍然不确定...
找到 bootstrap-4 JS 脚本以获得最佳性能的最佳位置和最佳脚本标签 (defer/async) 是什么？
在 Bootstrap 文档中：“将以下 s 放在页面末尾附近，在 body 结束标记
之前</body>
他们不使用任何脚本标签 (defer/async)
我阅读了脚本标签， 有些人写道，在 body 结束标记之前定位脚本就像定位带有 "defer" 标记的标题一样。 （旧浏览器除外） 有人说 "performance would be better if the scripts are still at the end, as they will be downloaded later"
下面是最佳实践吗？？？
在 body 结束标记之前定位 jquery/popper/bootstrap，首先 jquery 并使用延迟到 popper.min.js 和 bootstrap.min.js?
<body>
......
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script defer src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" ></script>
</body>
或者只是像 bootstrap 文档中那样不带 "defer" 标签？？
最好放在最后，你甚至可以在主体关闭后编写脚本：html 从顶部加载到按钮，当浏览器到达它下载的脚本元素时（并等待）源，所以如果你把它放在最后，页面将加载，然后 js 将被下载。请记住，需要 js 才能使视图动态化，因此在加载页面之前，您不需要以下功能：单击 dropdwon 并查看其内容。 Defer/async只是实现相同结果的一种方法，但并不完全相同。
Head 用于外部资源
最佳做法是在文档开头排除所有依赖项。 <head> 正是为此而生。由于 DOM 在页面加载时未加载，因此所有对 DOM 的引用都将失败。曾经有一段（黑暗的）时间，在延迟之前，通常会得到建议将脚本包含放在 </body> 之后但在 </html>.
但是如果脚本资源确实是在header中加载的，那么有一些更好的解决方案可以解决这个问题：
事件处理程序
一个技巧是等待 DOM 加载 DOMContentloaded event handler。该事件将在 DOM 加载并准备就绪后立即触发。这可以与 async 结合使用以加快页面加载的感知速度。
推迟
很长一段时间以来，可以将 JavaScript 的执行推迟到页面加载之后。 script src= 上的属性 defer 将按引用顺序对 JavaScript 进行排队。
异步
属性async不一定会在页面加载后执行脚本，它只是提示浏览器不要等待下载和执行JavaScript（块）而是与页面呈现并行执行。加载顺序不保证。
这适用于 JavaScript 中不直接依赖于页面内容或其他资源的业务逻辑。 (https://javascript.info/script-async-defer)。包括 bootstrap.min.js 和 async 很可能无法产生预期的结果。
WordPress
目前，但这很可能会改变，如果没有诡计，WordPress 不会延迟 JavaScripts。您可以依靠插件来做到这一点，或者 add a simple function 到您的 functions.php
内联JavaScript
如果 JavaScript 不是从 src 文件中读取而是直接包含 defer 和 async 将被忽略。如果内联 JavaScript 需要等待 DOM 加载，要么使用事件侦听器，要么确实将 <script></script> 放在之后但之前（如果代码在 [=24 之后，大多数浏览器都可以=]. html5 <html>-标签实际上是可选的)
Bootstrap
回答你的问题：对我来说，我不清楚为什么 Bootstrap 不在他们的脚本中使用或记录 defer 的使用。最后，他们甚至摆脱了对 jQuery 的依赖，所以我看不出为什么他们仍然 document 那样。