推迟Javascript优化网站

时间:2013-02-15 13:43:00

标签: javascript jquery asp.net performance pagespeed

优化我的网站,我正在使用Google Analytics工具检查分数。

我在stackoverflow.com上也提到过许多文章和研究,但没有得到任何适当的解决方案。

我的问题是我已将所有.js文件放在关闭正文标记附近的页面末尾,但分析显示推迟Javascript 并提供了js文件列表。

aspx文件中的代码如下所示:

<body>  
    <script type="text/javascript" src="js/default.js"></script>

    <script type="text/javascript" src="js/jquery.js"></script>

    <!--[if lt IE 9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->

    <script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-35073844-1']);
  _gaq.push(['_trackPageview']);

  (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);
  })();

    </script>

</body>

我也尝试了延迟属性,但得分没有变化。

我还尝试了javascript 代码,如下所示:

<script type="text/javascript">

 // Add a script element as a child of the body
 function downloadJSAtOnload() {
 var element = document.createElement("script");
 element.src = "js/jquery.prettyPhoto.js";
 document.body.appendChild(element);
 }

 // Check for browser support of event handling capability
 if (window.addEventListener)
 window.addEventListener("load", downloadJSAtOnload, false);
 else if (window.attachEvent)
 window.attachEvent("onload", downloadJSAtOnload);
 else window.onload = downloadJSAtOnload;

</script> 

但仍然没有变化。

我可以获得一些关于延迟javascript以便彻底理解的链接吗?

我在javascript方面经验不足。

请帮忙。谢谢。

1 个答案:

答案 0 :(得分:0)

您没有提及您测试过的浏览器,因为历史上并非所有浏览器都支持延迟,但支持现在要好得多(http://caniuse.com/script-defer

Aarron Peters写了一篇关于推迟JS的好帖子,直到onload被解雇http://www.aaronpeters.nl/blog/why-loading-third-party-scripts-async-is-not-good-enough

他的代码基本上看起来像:

<script>
(function(w, d, s) {
  function go(){
    var js, fjs = d.getElementsByTagName(s)[0], load = function(url, id) {
    if (d.getElementById(id)) {return;}
       js = d.createElement(s); js.src = url; js.id = id;
       fjs.parentNode.insertBefore(js, fjs);
    };
    load('//connect.facebook.net/en_US/all.js#appId=272697932759946&xfbml=1', 'fbjssdk');
    load('https://apis.google.com/js/plusone.js', 'gplus1js');
    load('//platform.twitter.com/widgets.js', 'tweetjs');
  }
  if (w.addEventListener) { w.addEventListener("load", go, false); }
  else if (w.attachEvent) { w.attachEvent("onload",go); }
}(window, document, 'script'));
</script>

就个人而言,我更喜欢以声明方式指定元素被推迟到的点的方式。 defer="onload"但这会带来一些问题。

相关问题