推迟加载js如何？

Question

我在页面底部引用了以下js脚本：

<script src="http://example.com/test.js" type="text/javascript"></script>

Google PageSpeed的建议是推迟加载此js。我不太明白该怎么做或影响。有人可以解释一下吗？

Answer 1

将属性defer添加到<script>标记应该这样做。 E.g：

<script src="http://example.com/test.js" type="text/javascript" defer></script>

这个想法是文件中的脚本只在整个页面加载完成后执行，而不是在浏览器解析<script>标签后执行脚本时的标准方式（可能延迟在<script>标记之后呈现代码。）

Answer 2

这些方法都不能真正保证执行。查看这篇很棒的文章，了解如何确保外部javascript执行确实被删除 feedthebot deffer execute javascript

Patrick Sexton撰写

Answer 3

以下是您想要做的事：http://davidwalsh.name/html5-async

  

<script async src="siteScript.js" onload="myInit()"></script>

或

  

<script defer src="siteScript.js" onload="myInit()"></script>

Answer 4

您可以使用async属性

<script src="http://example.com/test.js" type="text/javascript" async></script>

注意：

Internet Explorer 10，Firefox，Opera，Chrome和Safari支持async属性。

Answer 5

当存在从一个js到另一个js的依赖关系时，

async 可能不是一个好选择。例如。 file1.js依赖于file2.js，并且file1.js首先加载，开始执行但是失败并且由于file2.js中的某些依赖性而没有加载而引发错误。