YepNope (Modernizr) 和谷歌分析答案

【问题标题】：YepNope (Modernizr) and Google AnalyticsYepNope (Modernizr) 和谷歌分析
【发布时间】：2011-06-27 08:58:39
【问题描述】：

我正在使用出色的异步脚本加载器 yepnope.js（在 Modernizr2 中）。

我的问题是，将 latset Google Analtics 异步代码合并到 yepnope（如果有的话）的最佳方式是什么？

Google 建议将这个用于实际的分析代码：

<html>

<head>
  <script type="text/javascript">
    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', 'UA-XXXXX-X']);
    _gaq.push(['_trackPageview']);
  </script>
</head>

<body>
  <p>Page Content</p>

  <script src="some_random_script.js"></script>

  <p>Page Content</p>

  <script type="text/javascript">  (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>
</html>

但在 Modernizrs 文档中，他们提到了这一点：

// Give Modernizr.load a string, an object, or an array of strings and objects
Modernizr.load([
  // Presentational polyfills
  {
    // Logical list of things we would normally need
    test : Modernizr.fontface && Modernizr.canvas && Modernizr.cssgradients,
    // Modernizr.load loads css and javascript by default
    nope : ['presentational-polyfill.js', 'presentational.css']
  },
  // Functional polyfills
  {
    // This just has to be truthy
    test : Modernizr.websockets && window.JSON,
    // socket-io.js and json2.js
    nope : 'functional-polyfills.js',
    // You can also give arrays of resources to load.
    both : [ 'app.js', 'extra.js' ],
    complete : function () {
      // Run this after everything in this group has downloaded
      // and executed, as well everything in all previous groups
      myApp.init();
    }
  },
  // Run your analytics after you've already kicked off all the rest
  // of your app.
  'post-analytics.js'
]);

请注意底线：发布分析。我不想要一个新的 js 文件，因为那是另一个 HTTP 请求。

我要不要把它放在 yepnope 之外？把它放在 yepnope 框架内有什么好处吗？

阿迪

【问题讨论】：

标签： google-analytics modernizr yepnope

【解决方案1】：

我在Ignited-HTML5-Boilerplate 上找到了这个。

<script>
    window._gaq = [['_setAccount','UAXXXXXXXX1'],['_trackPageview'],['_trackPageLoadTime']];
    Modernizr.load({
        load: ('https:' == location.protocol ? '//ssl' : '//www') + '.google-analytics.com/ga.js'
    });
</script>

【讨论】：

【解决方案2】：

不确定这是否是将最新的 Google Analytics 代码整合到 yepnope 中的“最佳方式”，但将 google 代码整合到 yepnope 中的一种方式是：

<script type="text/javascript">
Modernizr.load([
  {
    // WEB ANALYTICS loaded by yepnope (beta)
    test: Boolean(SITEID = ''), // TODO: Fill the site ID to activate analytics
    complete: function() {
        if (SITEID) {
            var _gaq=[['_setAccount',SITEID],['_trackPageview']]; 
            (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];g.async=1;
            g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
            s.parentNode.insertBefore(g,s)}(document,'script'));
        }
    }
  }
]);
</script>

It should be OK 将此代码放在 </body> 标记之前。

【讨论】：