2

这是 Google 的异步分析跟踪代码：

<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-XXXXX-Y']);
  _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>


如果你问我这很丑陋。它可以浓缩成这样（图片来源：Mathias）：

<script>
  var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
  (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
  g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
  s.parentNode.insertBefore(g,s)}(document,'script'));
</script>


但是为什么我们不能只使用 HTML5async属性和相对协议的 URL呢？

<script src="//www.google-analytics.com/ga.js" async></script>
<script>var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];</script>

使用相对于协议的 URL，我们避免了检查 ,location.protocol属性async应该负责现代浏览器中的不显眼加载，并且会在其他浏览器中优雅地降级。

这不是更好吗？

4

3 回答 3

4

你可以这样做：

<script src="//www.google-analytics.com/ga.js" async></script>
<script>var _gaq= _gaq || [];
_gaq.push(['_setAccount','UA-XXXXX-X'],['_trackPageview']);
</script>

任何更短的内容都会有覆盖加载的风险，特别是 GA 覆盖的_gaq功能。ga.js_gaq.push

硬编码script[async]而不是使用 DOM 注入方法的问题在于，这script[async]不是使注入异步的唯一机制。script[async]在较旧的浏览器中，基于 JS 的注入即​​使没有支持也会导致异步注入。

但是，上面的代码应该在所有浏览器中都可以工作，但ga.js会在旧浏览器上阻塞。节省的额外字节不值得性能损失，但如果你这样做，你应该把脚本放在页脚。

（注意：协议相对 URL 将在这里工作，因为https://www.google-analytics.com/ga.js已由 Google 设置为可以工作。）

于 2012-05-09T21:04:31.697 回答
1

请注意，虽然 async 标记对于现代兼容的浏览器来说已经足够了，但它对旧的不兼容的浏览器没有作用。当然，它们会优雅地退化。但是它们完全不是异步的，只是忽略了 async 属性而降级。另一方面，如果您像他们使用的那样使用动态插入，则会使不兼容的浏览器表现得更像是异步的。

另一个重要的一点是，如果您只是重新定义 _gaq 对象，如果之前已加载 ga.js 文件，则可能会导致问题。大多数情况下不应该发生这种情况，但是有些网站最终会由于各种原因或只是错误地多次包含标签，这就是为什么保留_gaq = _gaq || []逻辑是个好主意。

Google analytics goal is not to be pretty, it's to be cross browser not just in the sense that it degrades gracefully but also in the sense that it works exactly the same way on all browsers as much as possible. If it works in a slightly different way on each browser it could skew the metrics for one browser and that's something you don't want. The first golden rule for data analysis is data consistency. Even if it means that you need to support ie5.5 for Mac.

于 2012-05-10T04:03:43.897 回答
0

假设异步被忽略，我在旧浏览器中看到了这种情况。

通过使脚本内联，您会导致非异步浏览器立即下载并执行它。此时，它会解析 _gaq，它到目前为止是一个数组，并执行存储的命令。然后它重写 push 方法，并向前使用它作为执行请求的函数（例如 _trackEvent）。

因此，通过同步获取脚本，然后将 _gaq 定义为数组，您将覆盖 Google 对 _gaq 所做的更改，并且会阻止页面浏览量被跟踪。

于 2012-05-09T19:30:17.753 回答