Lazy Load

Great script but i still have my doubts....

[dolcevita]

I have found great script to load lazy Adsense. Integration is easy

Find

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxxxx"
 crossorigin="anonymous"></script>

Replace with

<script>
 window.addEventListener('load', function() {
 var is_adsense_load = 0

 window.addEventListener('scroll', function() {
 if (is_adsense_load == 0) {
 is_adsense_load = 1;

 var ele = document.createElement('script');
 ele.async = true;
 ele.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'
ele.setAttribute('crossorigin', 'anonymous')
 var sc = document.getElementsByTagName('script')[0]
 sc.parentNode.insertBefore(ele, sc);

 (adsbygoogle = window.adsbygoogle || []).push({
 google_ad_client: "ca-pub-xxxx",
 enable_page_level_ads: true
 });
 }
 })
 })
</script>

Do not forget to put your Adsense number instead of xxxx in script code above. This line

google_ad_client: "ca-pub-xxxx",

Ads will be loaded only when scrolling starts. I tested with [pagespeed.web.dev...] and the mobile score is 99%.
Anyone using this script? What are his experiences? Namely, I am afraid that the income will be considerably lower than without it.

I'd be happy to test it for two or three days, but there is one thing I'd like to change, which is that only above-fold ads load normally, and the rest with this script. I am afraid that the appearance of Ads only on scrolling will drastically reduce the revenue provided by the most important Ads, which is the one above the fold.

[guarriman3]

Very interesting issue.

I just summary my comment made in March 2021 in this thread
[webmasterworld.com...]
- As you have implemented, on the mobile pages my 'adsbygoogle.js' is inserted (parentNode.insertBefore) just when the users start to scroll down.
- instead of pushing the ads in the regular way proposed by Google, I use the the SetTimeout proposed by @No5needinput, in order to break down the JavaScript long tasks. I use also 1000 miliseconds.
- My pagespeed improved (100% in all the pages) but the AVV metrics and the incomes dropped. My users have no time to see the the mobile ads placed on the top of the mobile pages, because such ads take 1-2 seconds to be viewable.

As far as I understand from the comment of our friend @Niresh12495 in the following thread, you are not implememting a 'lazy load', but a 'defer'
[webmasterworld.com...]

@Niresh12495 created code by using Intersection Observer, a real 'lazy load'. This is, instead of in the scrolling start, the ad pushes are made when user is due to reach the position of the ad. I would like to test it. I would appreciate any feedback.
[github.com...]

There is an explanation of the use:
[web.archive.org...]

[dolcevita]

Thanks for the comment. Since with the Adsense changes this month, impressions have become more important than ever, I have even greater skepticism with any implementation.
However i am open to the experiences of others and possible implementation of code based on others.

Namely, my motive is the slightly worse SERP for words in the mobile search engine. Sometimes it's about one position, and sometimes it's about a couple of positions, comparing it out to adesktop search engine.

I associate this with the worse result for mobiles, which do not pass the Core Web Vitals Assessment, while the desktop passes.

[dolcevita]

Another way with WP well known Flying script.

First, we’ll remove the adsbygoogle.js from all the page ad units, as shown below.

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

All the ad blocks should look similar to this. We’ve chosen an ad block of size 336×280 for mobile and desktop devices.

<!-- Large Rectangle -->
<ins class="adsbygoogle"
style="display:inline-block;width:336px;height:280px"
data-ad-client="ca-pub-xxxxxxxxxxxxxxxx"
data-ad-slot="1234567890"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

You can add the following script to your website’s footer section to boost its PageSpeed insight score.

Below this script, paste the Adsense ads serving script in the same format as displayed below. We’ve changed src to data-src to load the Adsense ads after the user interaction.
And data-type='lazy'> is added before </script> at the end of the code. Please note that you’ve to remove the following lines all ads block instead of all those. Paste the following

<script data-ad-client='ca-pub-XXXXXXXXXXXXXXXX' data-src='https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js' data-type='lazy'></script>

I haven't tried it, but as far as I understand this does not include auto ads, but personally created ad units, where each of them can be modified as desired, so for example the above fold unit can be left without lazy load, and the rest of the below fold can be as desired to decide which Ad unit to load with lazy load.

[dolcevita]

To finish different implementations with this version that supposedly works with Auto Ads.

Place in footer before </body> tag.Only change ca-pub-xxxxxxxxxxxx with your own:

<script>
  !function(){const e=document.createElement("script");e.async=!0,e.setAttribute("crossorigin","anonymous"),e.src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-00000000000000000";let t=0;document.addEventListener("mousemove",function(){1==++t&&document.getElementsByTagName("HEAD").item(0).appendChild(e)}),window.onscroll=function(n){1==++t&&document.getElementsByTagName("HEAD").item(0).appendChild(e)},setTimeout(function(){0===t&&(t++,document.getElementsByTagName("HEAD").item(0).appendChild(e))},5e3)}();
</script>

This seems to work with Auto Ads ON..

[dolcevita]

This is a repost for flying scripts because i forgot to add code most important part of the code, the code for flying scripts. :)

Another way with WP well known Flying script.

First, we’ll remove the adsbygoogle.js from all the page ad units, as shown below.

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

All the ad blocks should look similar to this. We’ve chosen an ad block of size 336×280 for mobile and desktop devices.

<!-- Large Rectangle -->
<ins class="adsbygoogle"
style="display:inline-block;width:336px;height:280px"
data-ad-client="ca-pub-xxxxxxxxxxxxxxxx"
data-ad-slot="1234567890"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

You can add the following flying script code to your website’s footer section to boost its PageSpeed insight score.

<script id='flying-scripts' type='text/javascript'>const loadScriptsTimer=setTimeout(loadScripts,5*1000);const userInteractionEvents=["mouseover","keydown","touchstart","touchmove","wheel"];userInteractionEvents.forEach(function(event){window.addEventListener(event,triggerScriptLoader,{passive:!0})});function triggerScriptLoader(){loadScripts();clearTimeout(loadScriptsTimer);userInteractionEvents.forEach(function(event){window.removeEventListener(event,triggerScriptLoader,{passive:!0})})}function loadScripts(){document.querySelectorAll("script,iframe[data-type='lazy']").forEach(function(elem){elem.setAttribute("src",elem.getAttribute("data-src"))})}</script>

Below this script, paste the Adsense ads serving script in the same format as displayed below.
We’ve changed src to data-src to load the Adsense ads after the user interaction.
And data-type='lazy'> is added before </script> at the end of the code. Please note that you’ve to remove the following lines all ads block instead of all those. Paste the following

<script data-ad-client='ca-pub-XXXXXXXXXXXXXXXX' data-src='https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js' data-type='lazy'></script>

I haven't tried it, but as far as I understand this does not include auto ads, but personally created ad units, where each of them can be modified as desired, so for example the above fold unit can be left without lazy load, and the rest of the below fold can be as desired to decide which Ad unit to load with lazy load.

[dolcevita]

I think that the idea of setting load timeout from flying script is very intersting and acceptable, where the timeout can be set to a time that suits you. By default, it is 5x1000, which is a 5 second delay, but say 1, 2 or 3 seconds seems quite ideal so that the earnings do not decrease, and the pagespeed reaches the magic number of 100.

Any thoughs about this or experience with flying scripts?