[Adsense Lazy Load] アドセンスを遅延読み込みさせてみました。[Blogger]

Google Logo Background : https://www.cleanpng.com

アドセンスを遅延読み込みさせてみました

PageSpeed Insights でモバイルのスコアが低かったので対策してみました

検索すると大体2種類くらいのJavaScriptがありました（jQueryなし）

追記：リンク切れ（サイト閉鎖）があったので簡易的なアーカイブとしてコードの引用を追加しました。

1. How to Setup Lazy Load for Google AdSense Ad units? 表示領域を確保したのちに？遅延読み込みするようです。スコアあまり変わらず
コード引用 クリックすると開きます

Method 1. onload event

Hint: Noptimize tag is present to make compatible with Autoptimize. It will prevent aggregating AdSense lazy loader inline JS.

<!--noptimize-->
<script type="text/javascript">
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";
document.body.appendChild(element);
}
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;
</script>
<!--/noptimize-->

How to Setup Lazy Load for Google AdSense Ad units?

Method 2. onscroll event

This approach will load ad unit once user scroll your web page.

<script type='text/javascript'>
//<![CDATA[
var la=!1;window.addEventListener("scroll",function(){(0!=document.documentElement.scrollTop&&!1===la||0!=document.body.scrollTop&&!1===la)&&(!function(){var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)}(),la=!0)},!0);
//]]>
</script>

How to Setup Lazy Load for Google AdSense Ad units?

2. How to Lazy Load Adsense Ads in Blogger - Rauf Graphics スクロールさせるとアドセンスの読み込みが始まるようです。スコア変化あり（リンク切れ確認2021年3月）
3. Mempercepat Loading Blog yang Terpasang Iklan Google Adsense - blog zdienos ２とコードが似ていました、挙動も同じ感じでした
コード引用 クリックすると開きます

<script>
//<![CDATA[
//lazy load ads
var lazyloadads = false;
window.addEventListener("scroll", function() {
    if ((document.documentElement.scrollTop != 0 && lazyloadads === false) || (document.body.scrollTop != 0 && lazyloadads === false)) {

        (function() {
            var ad = document.createElement('script');
            ad.type = 'text/javascript';
            ad.async = true;
            ad.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js';
            var sc = document.getElementsByTagName('script')[0];
            sc.parentNode.insertBefore(ad, sc);
        })();

        lazyloadads = true;
    }
}, true)
//]]>
</script>

Mempercepat Loading Blog yang Terpasang Iklan Google Adsense - blog zdienos

実際にスコアがよくなったのは 2と3のコードでした。

実際に設置

HTMLを編集します。必ずバックアップを取ってから作業してください。

[テーマ] - [HTMLの編集]で作業します

手順

1. 既存の

   <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

   をすべて削除
2. 上記の2か3のコードを</body>の直上に貼り付け（自分は3のコードにしました）

未知の不具合、Googleからの指摘、アドセンスの収益の減少などがあるかもしれないので、設置の際は自己判断でお願いします。

新しい記事を書きました。

[Adsense Lazy load] スマホの時のみアドセンスを遅延読み込みさせる [Mobile only] | すたすた式

スマートフォンの時にのみアドセンスを遅延読み込みさせる（スクロールすると読み込みが始まる）JavaScriptです

sutasutashiki.blogspot.com