新版UA在管理后台提供的跟踪代码是同步的,即需要先加载:analytics.js,再做数据提交。这样会有一些问题,即影响前端性能,也可能导致出错,如按钮事件触发时,analytics.js还没有加载。
// 默认的UA代码
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-xxxx-x', 'jiyang.me');
ga('send', 'pageview');
老板本GA是没有问题的,通过先创建_gaq
的全局变量,来支持异步加载:
// 老版GA代码
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-xxxx-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);
})();
其实UA是支持异步的,只要稍做调整即可:
// 调整优化后的UA代码
// 创建全局 ga 函数,类似于:var _gaq = _gaq || [];
var ga = ga || function() {(ga.q = ga.q || []).push(arguments)};
// 指定账号,Cookie域名
ga('create', 'UA-xxxx-x', 'jiyang.me');
// 页面浏览数据提交
ga('send', 'pageview');
// 或事件跟踪
ga('send', 'event', 'button', 'click');
// analytics.js 脚本加载放页脚即可
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
总体来讲,UA在代码的定制性,灵活性都要有改善,大家可以先从统计代码的优化开始,逐步把UA用起来。