【问题标题】:Async Google Analytics [Javascript Golf]异步谷歌分析 [Javascript 高尔夫]
【发布时间】:2010-10-18 17:44:38
【问题描述】:

很遗憾,这可能不是一个有效的 Code-Golf 问题,因为它可能只是 Javascript;但是,由于 这可能是唯一在现实世界中有用的代码高尔夫比赛 我将继续发布它。 em>


Google Analytics Asyncronous Trackingsn-p 被许多网站使用。

脚本有点像这样:

<script type="text/javascript">

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

获胜者将由最短的 RAW DEFLATE(HTTP 1.1 DEFLATE(又名 zlib)和 RAW DEFLATE 之间存在差异)按字节数压缩的最短代码决定,该代码将加载和初始化异步 Google Analytics在页面上。

在平局的情况下,获胜者将由原始字符数决定。如果我们仍然有平局,我们将根据最后一次编辑/提交时间来决定。

一些规则:

  • gaq || [] 检查不是必需的,应该被删除。
  • 必须“感知”协议(http 与 https)。
  • 不得污染全局命名空间(_gaq 变量除外)。
  • 必须可复制粘贴到任何 (X)HTML 文档,即不依赖于页面的标记。
  • 必须在所有A-Grade browsers中工作。
  • 必须通过 JSLINT 或任何 HTML 验证器。
  • 必须设置async 标志。
  • 必须使用 this deflator 作为 deflate 压缩输出的字节数。

提示:



UDPATE 216/275

由于我的原始版本已被击败,我将继续将其发布在此处:
注意:这有一个错误,即所有“http”请求的 async 都设置为 false

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

【问题讨论】:

  • 我只是删除 code-golf 标签。这实际上是“最好的最小代码”的应用程序,因此它与解决您的问题直接相关(如果您实际上将其声明为问题)。它不应该是关于“获胜”;就像许多其他问题一样,接受的答案将是最接近满足您的要求/符合您的标准的答案。
  • “必须设置async 标志”是为了什么?我认为动态添加的脚本不会阻止那些浏览器。
  • async 是一个 HTML5 属性,目前可能只有 firefox 3.6 支持:stackoverflow.com/questions/1834077/…
  • @matyr:我实际上不确定...我只是添加了它,因为我在某处读到了为什么它首先被包含...一些关于未来实现如何处理它的信息。
  • 动态添加的脚本不会在除 Firefox 和 Opera 之外的所有浏览器中被阻止。为这些浏览器添加了 async 标签。不过目前只有 Firefox 支持它。

标签: javascript google-analytics code-golf


【解决方案1】:

更新了在FF3.6、Opera10、Chrome6、MSIE8中测试的版本:

194/270:异步,getElementsByTagName 缓存

(_gaq=document.createElement("script")).src=(/^....s/.test(location)?"//ssl":"//www")+".google-analytics.com/ga.js",(_gaq.a=_gaq.async=document.getElementsByTagName("script")[0]).parentNode.insertBefore(_gaq,_gaq.a),_gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]]

192/297:异步,无缓存

(_gaq=document.createElement('script')).src=(/^....s/.test(location)?'//ssl':'//www')+'.google-analytics.com/ga.js',_gaq.async=document.getElementsByTagName('script')[0].parentNode.insertBefore(_gaq,document.getElementsByTagName('script')[0]),_gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']]

189/259:没有异步,缓存了 getElementsByTagName

(_gaq=document.createElement('script')).src=(/^....s/.test(location)?'//ssl':'//www')+'.google-analytics.com/ga.js',(_gaq.a=document.getElementsByTagName('script')[0]).parentNode.insertBefore(_gaq,_gaq.a),_gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']]

188/286:无异步,无缓存

(_gaq=document.createElement('script')).src=(/^....s/.test(location)?'//ssl':'//www')+'.google-analytics.com/ga.js',document.getElementsByTagName('script')[0].parentNode.insertBefore(_gaq,document.getElementsByTagName('script')[0]),_gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']]

184/242,没有异步,appendChild(不需要缓存),不知道是否在所有地方都支持

(_gaq=document.createElement('script')).src=(/^....s/.test(location)?'//ssl':'//www')+'.google-analytics.com/ga.js',document.getElementsByTagName('script')[0].parentNode.appendChild(_gaq),_gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']]

学分

  • casablanca: /^https/.test(location)
  • matyr:相对路径,语句之间的逗号,异步赋值
  • some:没有匿名函数和_gaq的使用,getElementsByTagName的非缓存,异步的移动赋值,/^....s/
  • David Murdochtype="text/javascript"

此外,如果您使用 "" 引用标记属性,将 ' 更改为 " 可能会提高 HTML 源代码的压缩率。

有关更多信息,请参阅此帖子中的 cmets

由于这篇文章现在是社区 wiki 并且被接受的答案,我删除了我的第一次尝试(如果你有兴趣,你可以在修订历史中找到它们)并且只显示最新的修订。有关更多信息,请参阅此帖子中的 cmets。 /some

【讨论】:

  • 可以通过使用 1 而不是 true 来节省一些字节,如果可以假设第一个脚本具有正确的类型,则可以将该类型用于创建的脚本元素。
  • 好的开始!这里可以进行很多改进。我个人最好成绩是 216/275。
  • @David Murdoch:是的,还有很多事情要做。但是当我减小原始大小时,瘪的保持在 250 左右......我运行你的代码,这给了我 249!好吧,当我看到你更新了规则时,我再试几次。
  • @some: ""+location 是个好主意。你应该仍然可以使用[4] 而不是charAt
  • @some:干得好! www 不应该因为缓存原因而被删除。在某些情况下,document.documentElement.firstChild.appendChild(_gaq) 方法在某些浏览器 (addyosmani.com/links/2010/05/12/appendchild-vs-insertbefore) 上会失败,这就是分析团队在 2 月份将推荐代码更改为使用 prependChild 的原因。
【解决方案2】:

183/223 (17.94%) -- 异步、协议感知、无命名空间污染

_gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]],function(a,b,c,d){a["get"+b+"sByTagName"](c)[0].parentNode.appendChild(d=a["create"+b](c),d.src=d.async="//google-analytics.com/ga.js",d)}(document,"Element","script");

185/228 (18.86%) -- 异步,协议感知,no 命名空间污染(带有de 变量)

_gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]],function(b,a,c){d=a["create"+b](c),d.async=d.src="//google-analytics.com/ga.js",e=a["get"+b+"sByTagName"](c)[0],e.parentNode.insertBefore(d,e)}("Element",document,"script");

186/233 (20.17%) -- 异步、协议感知、无命名空间污染

_gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]],(function(a,b,c,d,e){d=a["create"+b](c),d.async=d.src="//google-analytics.com/ga.js",e=a["get"+b+"sByTagName"](c)[0],e.parentNode.insertBefore(d,e)})(document,"Element","script")

适用于 Chrome、Firefox、IE 7+、Opera 和 Safari。

【讨论】:

  • 183 个泄气,223 个原创——我认为我们有一个新的赢家;)(开个玩笑,伙计们!)
【解决方案3】:

(1)第一次尝试

_gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']],function(s,g){g=document.createElement(s),g.async=g.src=(/^https/.test(location)?'//ssl.':'//')+'google-analytics.com/ga.js',s=document.getElementsByTagName(s)[0],s.parentNode.insertBefore(g,s)}('script')

压缩后的长度为:199 字节。 原始长度为:259 字节。 节省 23.17%

(2) (1) + 一些的第四次

_gaq=document.createElement('script'),_gaq.async=_gaq.src=(/^https/.test(location)?'//ssl.':'//')+'google-analytics.com/ga.js',document.getElementsByTagName('script')[0].parentNode.insertBefore(_gaq,document.getElementsByTagName('script')[0]),_gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']]

压缩后的长度为:192 字节。 原始长度为:297 字节。 节省 35.35%

【讨论】:

  • 哇!没有协议并且使用逗号而不是分号......它仍然适用于 FF、Chrome、Opera 和 MSIE!精彩的!但是,您应该在末尾放置一个分号(使其为 193 个字节),以便可以将代码粘贴到任何地方(例如,如果代码与其他代码一起被缩小)。我仍然对它在脚本标签中没有协议的情况下工作感到惊讶,因为它在浏览器地址栏中不起作用。它不应该工作它服务器同时监听 http 和 https。但是对于这种情况,它可以工作,因为 ssl-server 只监听 htts。太好了!
  • 忘了提到为异步赋值的巧妙用法!
  • 对浏览器更友好的版本(缓存 getElementByTagName 的结果)为 196 个字节(194 个不带最后一个分号):_gaq=document.createElement('script'),_gaq.async=_gaq。 src=(/^https/.test(location)?'//ssl.':'//')+'google-analytics.com/ga.js',(_gaq.s=document.getElementsByTagName('script' )[0]).parentNode.insertBefore(_gaq,_gaq.s),_gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
  • 删除www 很聪明,但会破坏从“跨站点”缓存中获得的任何优势。每个冷缓存(未访问过您的站点)访问者都需要下载非 www ga.js。
  • 刚刚意识到为什么它可以在不指定协议的情况下工作。为你 +1!
【解决方案4】:

按照更新规则更新:

包括&lt;script&gt; 标签:Deflated 长度为:226 字节。原始长度为:298 字节。

没有&lt;script&gt; 标签:Deflated 长度为:216 字节。原始长度为:281 字节。

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

加入@some 的想法(仅检查location[4] 并使用1 获取true)节省了4 个字节(212),但我不能为此归功于。

【讨论】:

  • 提示:` type="text/javascript"` 不是必需的。
  • @David Murdoch:根据您的宽松规则更新。
  • @casablanca:非常好! 212/271 令人难以置信。
  • 压缩了一个字节的压缩版本... 211.
  • @Casablanca:注意到 location[4] 不能使用,因为它不是普通字符串。
【解决方案5】:

这可能是作弊,尽管从技术上讲它遵守所有规则。 ;)

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

【讨论】:

  • 我认为 IE 9 不支持 async 属性。我想问题是“IE 9 被认为是 A 级吗?”)。
【解决方案6】:

考虑到我对 Javascript 的缺乏经验,这可能是我最好的尝试。这里没什么大不了的:

_gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
(function(d,e){e=d.createElement('script');e.id='s';e.async=1;
e.src='http'+('s'==d.location.protocol[5]?'s://ssl':'://www')+'.google-analytics.com/ga.js';
d=d.getElementByTagName('script');d.parentNode.insertBefore(e,d);})(document);

编辑

修复了@some 谈到的错误。

压缩后的长度:219 字节
原始长度:285 字节

【讨论】:

  • 很抱歉告诉你,你的代码有一些错误:p是全局的,document.protocol不存在(至少在firefox中不存在)并且你无法获取元素s的id因为它还没有被插入到 dom 中。
  • 但从积极的方面来说,Deflated Length 是:211 字节。原始长度为:265 字节(去掉换行和数组中逗号后的空格。
  • 我忘了提到如果你想测试's',[5] 应该是 [4]。可悲的是,你不能在 msie 中使用 [x],必须使用 charat。
【解决方案7】:
(function(d,l,t,g){_gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]];(g=d.createElement(t)).src=(l[5]?"ssl.":"")+"google-analytics.com/ga.js";g.async=1;(t=d.getElementsByTagName(t)[0]).parentNode.appendChild(g,t)})(document,location.protocol,"script")

压缩后的长度为:206 字节。 原始长度为:256 字节。 节省 19.53%

对比没有异步:

(function(d,l,t,g){_gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]];(g=d.createElement(t)).src=(l[5]?"ssl.":"")+"google-analytics.com/ga.js";(t=d.getElementsByTagName(t)[0]).parentNode.appendChild(g,t)})(document,location.protocol,"script")

压缩后的长度为:199 字节。 原始长度为:246 字节。 节省 19.11%

--

稍微短一点是这样的:

var d=document,t="script",g;_gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]];(g=d.createElement(t)).src=(location.protocol[5]?"ssl.":"")+"google-analytics.com/ga.js";g.async=1;(t=d.getElementsByTagName(t)[0]).parentNode.appendChild(g,t)

放气后的长度为:196 字节。 原始长度为:242 字节。 节省 19.01%

对比没有异步:

var d=document,t="script",g;_gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]];(g=d.createElement(t)).src=(location.protocol[5]?"ssl.":"")+"google-analytics.com/ga.js";(t=d.getElementsByTagName(t)[0]).parentNode.appendChild(g,t)

压缩后的长度为:188 字节。 原始长度为:232 字节。 节省 18.88%

--

压缩 188 字节,原来的 232 字节是我能做到的最短... ;)

【讨论】:

  • 你真的测试过这些吗?我想你会发现没有一个会加载分析。请参阅paulirish.com/2010/the-protocol-relative-url 了解更多信息。
  • 啊该死的。是的,我后来把它们拿出来,忘记了我遇到的错误......该死......好吧......稍后再试一次。
【解决方案8】:

第一次尝试,感谢这里的每个人的想法。

200/253(我不知道如何针对 deflate 进行优化……我唯一做的就是更改变量名)

_gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]],function(e,t){(c=e.createElement(t)).async=c.src=(/s:/.test(location)?"//ssl":"//www")+".google-analytics.com/ga.js";(e=e.getElementsByTagName(t)[0]).parentNode.insertBefore(c,e)}(document,"script")

195/258不会使用 (document,"script") 帮助吗?

_gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]],function(){(e=document.createElement("script")).async=e.src=(/s:/.test(location)?"//ssl.":"//")+"google-analytics.com/ga.js";(t=document.getElementsByTagName("script")[0]).parentNode.insertBefore(e,t)}()

对于尽可能小的代码,您甚至不需要“ssl”。和“万维网”。前缀。这仍然符合比赛规则...

175/216

_gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]],function(e,t){(a=e.createElement(t)).async=a.src="//google-analytics.com/ga.js";(e=e.getElementsByTagName(t)[0]).parentNode.insertBefore(a,e)}(document,"script")

174/224第二次和第三次优化结合...

_gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]],function(){(e=document.createElement("script")).async=e.src="//google-analytics.com/ga.js";(t=document.getElementsByTagName("script")[0]).parentNode.insertBefore(e,t)}()

编辑:现在使用正则表达式 /s:/ 等等...

194/266 显然重用 _gaq 有帮助...

(_gaq=document.createElement("script")).async=_gaq.src=(/s:/.test(location)?"//ssl":"//www")+".google-analytics.com/ga.js",(_gaq._=document.getElementsByTagName("script")[0]).parentNode.insertBefore(_gaq,_gaq._),_gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]]

166/229 并且没有“ssl”和“www”...

(_gaq=document.createElement("script")).async=_gaq.src="//google-analytics.com/ga.js",(_gaq._=document.getElementsByTagName("script")[0]).parentNode.insertBefore(_gaq,_gaq._),_gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]]

【讨论】:

  • 如果你不太挑剔的话:var _gaq=[["_setAccount","UA-XXXXX-X"],[ "_trackPageview"]]; document.head.appendChild(document.createElement("script")).src="//www.google-analytics.com/ga.js";
【解决方案9】:

这个违反了一些规则,但它是迄今为止最短的,也是我使用的, 165/196 (16%)

_gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']]+function(d,e,s){d['get'+e+'sByTagName'](s)[0].appendChild(d['create'+e](s)).src ='//google-analytics.com/ga.js'}(document,'Element','script')

一些注意事项:

  • 设置异步属性,但现代浏览器中被认为是异步的。
  • 它确实不会根据当前协议重写 URL,但它应该可以在安全站点上使用,因为它使用了协议相对 URL(我绝不是专家,但打开 https://google-analytics.com/ga.js在我的浏览器中给了我一个绿色的锁形图标)
  • 我发现将脚本放在文档末尾并省略 &lt;/script&gt;&lt;/body&gt;&lt;/html&gt; 以便咀嚼几个字节是聪明,脚本永远不会被评估..
  • 我敢肯定,如果有人足够敬业且足够聪明,甚至可以缩短此时间 ;-)

更易读的格式:

_gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']]
+函数(d,e,s){
    d['get'+e+'sByTagName'](s)[0]
        .appendChild(d['create'+e](s))
        .src ='//google-analytics.com/ga.js'
}(文档,'元素','脚本')

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-03-31
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多