cocoon高速化AdSense自動・手動広告を遅延読み込み化させてPageSpeed Insightsスコアを上げる方法

アドセンスの自動広告と手動広告をまとめて遅延読み込み化させます。

PageSpeed Insightsのスコアが冗談抜きで10点以上も上がることもあるサイト高速化に激しく寄与する方策です。

なお、自動広告の遅延読み込み化をさせても全画面にどーーんと表示されるインライン広告については何ら変わりなく表示されます。不思議ですが。

AdSenseの遅延読み込み
遅延読み込み化によるサイト収益への影響
まとめ cocoonでアドセンスを遅延読み込み化させる方法

AdSenseの遅延読み込み

手動広告の遅延読み込み化を設定するだけで自動広告についても勝手に遅延読み込み化するので設定自体は手動広告のみについて行えば良いです。

なお繰り返しになりますがインライン広告はアクセスの途端に表示されます。（検証済み・原因は不明）

遅延読み込み設定をする

ttps://www.kengenius.com/it/optimum_cocoon_for_core_web_vitals_and_adsense

上記の記事を参考にさせていただきました。御礼申し上げます。

まず以下のコードをcocoon設定の「その他のアクセス解析・認証コード設定」→「フッター用コード」に設定します。

なお「ca-pub-XXXXXXXXXXXXXXX」を自身のものに書き換えます。

<script type="text/javascript">
(function(window, document) {
  function main() {
    // GoogleAdSense読込み
    var ad = document.createElement('script');
    ad.type = 'text/javascript';
    ad.async = true;
    // 新コードの場合、サイト運営者IDを書き換えてコメントアウトを外す
    ad.dataset.adClient = 'ca-pub-XXXXXXXXXXXXXXX';
    ad.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js';
    var sc = document.getElementsByTagName('script')[0];
    sc.parentNode.insertBefore(ad, sc);
  }
 
  // 遅延読込み
  var lazyLoad = false;
  function onLazyLoad() {
    if (lazyLoad === false) {
      // 複数呼び出し回避 + イベント解除
      lazyLoad = true;
      window.removeEventListener('scroll', onLazyLoad);
      window.removeEventListener('mousemove', onLazyLoad);
      window.removeEventListener('mousedown', onLazyLoad);
      window.removeEventListener('touchstart', onLazyLoad);
      window.removeEventListener('keydown', onLazyLoad);
      main();
    }
  }
  window.addEventListener('scroll', onLazyLoad);
  window.addEventListener('mousemove', onLazyLoad);
  window.addEventListener('mousedown', onLazyLoad);
  window.addEventListener('touchstart', onLazyLoad);
  window.addEventListener('keydown', onLazyLoad);
  window.addEventListener('load', function() {
    // ドキュメント途中（更新時 or ページ内リンク）
    if (window.pageYOffset) {
      onLazyLoad();
    }
  //何もアクションがないときは指定秒数後に読み込み開始（ミリ秒）
  window.setTimeout(onLazyLoad,3000)
  });
})(window, document);
</script>
<!--/ Adsense 遅延読み込み -->