javascript - 包含 Javascript 的最佳方式是什么？

Question

许多大公司推荐的技术略有不同。主要是关于新<script>的安置.

Google Anayltics :

(function() {
  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

Facebook :

(function() {
  var e = document.createElement('script'); e.async = true;
  e.src = document.location.protocol +
    '//connect.facebook.net/en_US/all.js';
  document.getElementById('fb-root').appendChild(e);
}());:

Disqus :

(function() {
    var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
    dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();

(发布其他人，我会添加他们)

这些选择是否有任何规律或原因，或者根本不重要？

Answer 1

这些在精神上实际上都是相同的方法。这个想法是推迟脚本，这样它们就不会互相阻塞或完成文档。

在网站内容之后加载额外的外部资源是一种常见的做法。这样做时，您希望 a) 防止阻塞 onload 事件，以便您的页面更快地“完成”，以及 b) 并行加载资源，如上所示。

Steve Souders 声称“渐进增强”是当今网站性能最重要的概念。这个概念建议您尽快提供基本页面，然后根据需要在加载事件或用户请求时提供额外的内容/服务。

现在有一些框架可以提供帮助。参见 http://headjs.com/