新しい時代！Googleアナリティクスの新タグ「gtag.js」について

Googleアナリティクスのトラッキングコードは実は下記の様に進化してきました。
現在Googleアナリティクスで正式に発行されるトラッキングコードは第5世代のgtag.jsとなります。
第5世代といってもまだベータ版なんです。。。
ベータ版を発行してるくらいなんでこのまま確定になるとは思いますが！

<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-xxxxxx-x";
urchinTracker();
</script>

<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("UA-xxxxxxx-x");
pageTracker._initData();
pageTracker._trackPageview();
</script>

<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try{
var pageTracker = _gat._getTracker("UA-xxxxxx-x");
pageTracker._trackPageview();
} catch(err) {}
</script>

<script type="text/javascript">
 
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-xxxxxx-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>

<script>
  (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-xxxxxx-x', 'xxxxxx.co.jp');
  ga('send', 'pageview');
 
</script>

<script async src="https://www.googletagmanager.com/gtag/js?id=UA-xxxxxxxx-1"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments)};
  gtag('js', new Date());
  gtag('config', 'UA-xxxxxxxx-1');
</script>

世代が変わった際に注意すべき点として
イベントトラッキングなどの命令が変わってしまうということです（泣）
※まだ以前のタグも動作しますので安心してください。

これは、おそらくGoogleオプティマイズ絡みかな？
※HEAD直下なので、コードを間違えるとページが真っ白にもなりかねません。激注意！

実は今までのトラッキングコードでは、ga(‘send’,～) という命令があり、
実行されたらGoogleアナリティクスへデータ送信をしていました。
しかし、今回の変更から、「データ送信するほうがデフォルト」と変更されたようです。
つまり、送信したくないときは、あえて「送信しない」と教えてあげなければいけなくなりました。

このようにデータ送信の設計自体の変更になるので、
イベントトラッキングやクロスドメインなど、
これまでスクリプトを埋め込んだりカスタマイズしなければいけないものは、
ほぼ全てリプレースとなります。（泣）

gtag.jsのコードの中身を見る限り・・・
gtag.js内でanalytics.jsに言及しているので、
gtag内にはanalytics.jsの機能がそのまま入っている感じはしますが。。。

まーでも記述方法はかわりますよねー・・・
元エンジニアの方以外は、どう記述すればよいか分からないという方も多いと思います。

現時点でgtag.jsでの計測は可能となっています。
これからGoogleアナリティクスを学ばれるかたはgtag.jsで学んでしまっていいと思います。

現在サイトにanalytics.jsを組み込まれている場合は、
gtag.jsになったからといってタグを急いで差し替える必要はないかなと。
機能面で大きな拡張等があるまでは当面、今のままで問題ないと思います。

ただ、今後もgtag.jsの情報に関してはアンテナを張っておく必要がありそうですね。
また今度、実際のイベントなどの計測方法について書きたいと思います。

ーーーーーーーーーーーーーーーーーーーーー

＜＜追記＞＞gtag.jsでの計測方法もろもろ下記の記事にまとめました！
▶従来とは違うgtag.jsのクリック計測からその他の計測方法について