初回のユーザイベントまで読込みを遅延することで、ページ表示速度を改善する。
スクロールやタップなどの行為が発生して初めて広告が表示されるため、違和感もかなり少ない。3000ミリ秒経ったら勝手に表示することにしている。
Header内の
<script data-ad-client="ca-pub-XXXXXXXXXXXXXXXXX" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
を削除し、代わりに以下のスクリプトを直前に挿入する。
<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-xxxxxxxxxxxxxxxxx';
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 遅延読み込み -->