One common problem publishers often face is that Google AdSense affects original blog speed. Due to not having control over optimizing resources, many end up sacrificing performance for revenue.

Similar to how YouTube video thumbnails should use WebP, AdSense ad units often come with massive resources, multiple DNS lookups, and extra loads that can kill your page speed. In this guide, we'll explore how to regain control using lazy loading.

Table of Contents

    Why is it Important to Lazy Load AdSense Ads?

    AdSense scripts can be incredibly slow. They often lack GZIP compression or minification for certain assets, and the "async" nature isn't always enough to prevent blocking the critical rendering path. By implementing a lightweight lazy load solution, you ensure that your primary content serves first, before the Ad Units take over the browser's resources.

    ⚠️
    Performance Note: I am not personally a huge fan of lazy loading even for images, but for AdSense, it is often a necessity if you are highly concerned with serving primary content first.

    How to Setup Lazy Loading for AdSense

    A standard AdSense ad unit code looks like this:

    <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
    <!-- leaderboard -->
    <ins class="adsbygoogle"
     style="display:inline-block;width:728px;height:90px"
     data-ad-client="ca-pub-xxxxxxxxxxxxxxxx"
     data-ad-slot="1234567890"></ins>
    <script>
    (adsbygoogle = window.adsbygoogle || []).push({});
    </script>

    While this loads asynchronously, the browser still starts downloading the adsbygoogle.js script immediately. We want to change this to a "defer-like" behavior where it only loads after the main page is ready.

    Step 1: Remove the global script

    Remove the following line from all your existing ad units:

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

    Step 2: Use an optimized loading method

    Choose one of the following methods to inject the script later.

    Method 1: On-Load Event

    This method waits for the window to finish loading everything before starting the AdSense download.

    window.onload = function() {
      var adScript = document.createElement('script');
      adScript.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js';
      adScript.setAttribute('async', 'true');
      document.body.appendChild(adScript);
    };

    Method 2: On-Scroll Event

    This is the most effective way to save initial resources. The ads only load once the user starts interacting with the page.

    window.onscroll = function() {
      // Add logic to check if script is already added
      if (!window.adsense_loaded) {
        var adScript = document.createElement('script');
        adScript.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js';
        adScript.setAttribute('async', 'true');
        document.body.appendChild(adScript);
        window.adsense_loaded = true;
      }
    };

    Method 3: User Interaction (Best for WP)

    If you're on WordPress, tools like "Flying Scripts" can delay execution until there is no user activity. This is a "set it and forget it" solution that handles the keywords for you.

    📊
    Performance Results: Implementing these methods can improve your PageSpeed score significantly, often jumping from "Average" to "Fast" (90+) by reducing Total Blocking Time (TBT) and Largest Contentful Paint (LCP) delays.

    Key Parameters to Monitor

    • FCP (First Contentful Paint): Time when the first bit of content is rendered.
    • LCP (Largest Contentful Paint): When the largest element is visible.
    • TTI (Time to Interactive): When the user can actually use the site.
    • CLS (Cumulative Layout Shift): Ensuring ads don't push content down.

    Conclusion

    Setting up Lazy Load for Google AdSense ad units is a valuable strategy to optimize your website’s performance and enhance the user experience. By following these methods, you can improve your PageSpeed scores and potentially increase your ad revenue by keeping users on your site longer.

    Abhishek Dey Roy

    Written by Abhishek Dey Roy

    Abhishek Dey Roy is an SEO Consultant & Digital Strategist helping businesses scale online. He specializes in technical SEO, content strategy, and web performance optimization.

    Read More About Me →