javascript - 为什么像 Facebook、Disqus、Google、Twitter 这样的服务告诉我们

Question

为什么 Facebook Like Button、Disqus 评论等服务告诉我们将此代码添加到我们的文档中

<div id="fb-root"></div>
<script>(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 = "//connect.facebook.net/it_IT/sdk.js#xfbml=1&version=v2.5";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
</script>

而不是简单地添加这段代码是一样的吗？

<div id="fb-root"></div>
<script id="facebook-jssdk"src="//connect.facebook.net/it_IT/sdk.js#xfbml=1&version=v2.5"></script>

Answer 1

当浏览器找到 <script src="...">标记，它会阻止页面的进一步呈现，直到 javascript 已加载(或加载失败)。显然，这不是您想要的网站，因为外部 javascript 而卡住。

Facebook 为您提供了一个代码，可以异步加载 javascript，而不会干扰您的页面加载。从 HTML5 开始，您还可以为脚本标签提供“async”属性，从而获得类似的行为。 <script src="..." async></script>

您可以在本文中找到有关 javascript 加载的更多信息:http://www.html5rocks.com/en/tutorials/speed/script-loading/