所以我最近了解到，将您的 js 放在 DOM 的底部是过时的，我应该再次将它们放在 <head> 中。具有“async”和“defer”属性。
太棒了。但是我对应该根据优先级使用哪个感到有点困惑。
所以我有:
- jquery
- 对外观没有直接影响的 jquery 插件 页
- 对页面外观有直接影响的 jquery 插件
- 我自己的个人脚本，对外观有直接影响 页面，并且还依赖于 jquery
哪些应该异步，哪些应该延迟？
如果我对这一切的理解正确，那些对网站外观没有立即影响的应该被推迟，而其他一切都被异步。正确的？还是我把这些搞混了。
最佳答案
这很简单。您应该对可以按任何顺序执行的脚本使用 [async]，对必须在解析 HTML 后执行的脚本使用 [defer]。
例如，如果您有一个脚本可以在您的帖子旁边添加社交分享图标，并且该脚本不依赖于任何其他脚本，您可以同时使用 [async] 和 [延迟]。但是，如果您的脚本需要 jQuery，则不能使用 [async]，因为如果您这样做，它可能会在 jQuery 加载之前执行并中断。
如果您所有的脚本都需要 jQuery，那么您根本不应该使用 [async]。至于[defer]，就看你的脚本是否访问DOM了。对于插件，它可能无关紧要，但您可能需要它来编写您自己的代码。
如果您将脚本包装在 $(document).ready(); 中，您可以对不会立即生效的脚本使用 [defer](例如需要用户交互)。
关于javascript - 加载脚本时何时使用 async vs defer？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44443870/