【发布时间】：2020-02-14 02:19:41
【问题描述】：
【问题讨论】：
标签： javascript html
【发布时间】：2020-02-14 02:19:41
【问题描述】：
如果在外部脚本（带有 src= 的脚本）上设置了 async 属性，支持它的浏览器将在后台下载该脚本，而不会阻止页面上的其余内容。该脚本将在下载完成后执行。
http://dev.w3.org/html5/spec/Overview.html#attr-script-async
正如我在评论中提到的，设置 async=true、async=false 或 async=anything 都意味着相同的事情。它们启用异步行为。使脚本非异步的唯一方法是完全省略该属性。
http://dev.w3.org/html5/spec/Overview.html#boolean-attributes
【讨论】：
-
所以如果我记得设置
async，我不需要将javascript放在页面底部，对吧？ -
第一个链接的锚点不再起作用，文档上也没有提到
async。
在 XHTML 中，因此需要将属性记录为属性及其值，而 HTML 则不需要。我喜欢该原则的一致性，所以我总是以以下形式使用它：
async="async"
这样我可以将我的文档作为应用程序/xhtml+xml 提供。
如果这对您没有任何兴趣，因为您认为将文档作为 text/html 提供就足够了，那么您可以随时使用：
async
【讨论】：
-
您的回答提供了丰富的信息（关于 doc/mime 类型），但没有解决我的实际问题：
async属性有什么作用？ -
很抱歉我没有进入主题。
-
异步是脚本元素的新 HTML5 属性。它导致浏览器在找到脚本标记时继续解析页面的其余部分，而不是先解析脚本然后继续解析页面。我发现了一个有趣的教程：youtube.com/watch?v=KHSeGURldw8
HTML WHATWG specification 包含 the following explanation：
对于classic scripts，如果存在
async属性，则 经典脚本将与解析并行获取并评估为 一旦可用（可能在解析完成之前）。如果async属性不存在，但defer属性存在， 然后将并行获取经典脚本并在何时评估 该页面已完成解析。如果两个属性都不存在，则 立即获取并评估脚本，阻止解析 直到这些都完成。对于module scripts，如果存在
async属性，则模块 脚本及其所有依赖项将并行获取 解析，并且模块脚本将被评估 可用（可能在解析完成之前）。否则， 模块脚本及其依赖项将并行获取 当页面完成解析时解析和评估。 （defer属性对模块脚本没有影响。）这一切都总结在下面的示意图中：
出于历史原因，这些属性的确切处理细节有些重要，涉及 HTML 的许多方面。因此，实现要求必然分散在整个规范中。 [在 HTML 规范中描述的] 算法描述了这个处理的核心，但是这些算法引用并被 HTML 中脚本开始和结束标记的解析规则、外部内容和 XML 中的文档规则所引用。 write() 方法，脚本的处理等
即使指定了
async属性，也可以指定defer属性，以导致仅支持defer（而不支持async）的旧版Web 浏览器回退到defer行为而不是默认的阻塞行为。
【讨论】：
简单来说就是
- 下载外部脚本异步（或并行），而不阻塞 html 解析。
- 下载后的脚本将立即执行阻止 html 解析。
Here's 很好的插图。
注意：此属性仅适用于外部脚本（具有 src 属性的脚本），不适用于内联脚本。
【讨论】：
似乎也不需要async=async，而只需async
来自谷歌：
第二种技术是使用属性 where 适当的，这样可以防止解析阻塞初始页面 延迟加载，直到浏览器的 UI 线程不忙 别的东西。
https://developers.google.com/speed/docs/best-practices/mobile#DeferParsingJS
【讨论】：
只要异步就够了。
您可以同时尝试这两种方法，然后测量页面速度的差异。就像crictime 使用单一物质一样。
【讨论】：
-
不，不是所有情况。
-
在 XHTML 的情况下，用作 application/xml+xhtml 这是一个致命错误，当您注意到这样的属性时会导致页面冻结。