0

我刚刚阅读了有关延迟加载 js 的信息。我发现 Particks 的文章很有趣http://www.feedthebot.com/pagespeed/defer-loading-javascript.html。

我看了一下 facebook 和 google 的 js 代码。他们都在使用匿名函数，所以我想知道这是否是在页面加载后延迟 js 加载？

 (function(d, s, id){
   var js, fjs = d.getElementsByTagName(s)[0];
   if (d.getElementById(id)) {return;}
   js = d.createElement(s); js.id = id;
   js.src = "http://connect.facebook.net/en_US/sdk.js";
   fjs.parentNode.insertBefore(js, fjs);
 }(document, 'script', 'facebook-jssdk'));

还是帕特里克推荐是在页面加载后真正推迟加载 js 的唯一方法？

<script type="text/javascript">
  function downloadJSAtOnload() {
    var element = document.createElement("script");
    element.src = "defer.js";
    document.body.appendChild(element);
  }
  if (window.addEventListener) window.addEventListener("load", downloadJSAtOnload, false);
  else if (window.attachEvent) window.attachEvent("onload", downloadJSAtOnload);
  else window.onload = downloadJSAtOnload;
</script>

thx，我非常感谢您的专业知识！

4

2 回答 2

1

Both will download the script asynchronously and defer the execution after it is loaded, but the second script waits with starting to load the script until all other resources (including images!) have been loaded (which seems a bit late to me actually).

They are all using anonymous functions so I was wondering whether this is deferring js?

No, those IEFEs are only used to structure the code, they do execute immediately. What does defer the js is the dynamic creation of <script> elements.

于 2014-06-07T15:33:52.210 回答
0

好吧，让我试着解释一下：

第一个代码片段 ( FB, G+) Api 用于检查是否script存在并包含它。它被称为自执行函数。

笔记：

(function(x){
...
}(x));

通常是Self-Executing Anonymous Functions. 自调用函数会立即运行，即一旦在 Javascript 中遇到就会执行。它们在解析器遇到时立即执行（执行顺序取决于您放置包含它的函数或脚本的位置），因此名称自执行。

你的第二个片段。创建相同的功能，但将其绑定到window元素并等待所有窗口元素（DOM、图像、框架、iframe、链接、脚本等）loads完全。然后，只有这样它才会开始执行您的功能。所以它有点慢。比这更快的是：JQuery 的$(document).ready(.

要知道首先执行哪个加载事件，请查看我对这个问题的回答：这个 javascript/Jquery 代码的执行顺序是什么？

现在再次说明您的观点： 可以使用匿名函数来延迟加载 js 吗？

答案是否定的，因为这取决于您将自己执行的匿名函数放在哪里。仍然会比window.load.

希望能帮助到你 ：）。干杯!

于 2014-06-07T15:20:47.937 回答