Skip to main content
Missed the Live Event? Catch Up Now! Explore the key insights from our CTV Advertising Webinar with the full summary and video replay.
Knowledge BaseMedia Articles

Lazy Loading: Enhancing Viewability and Revenue for Publishers

By July 25, 2024August 11th, 2024No Comments
Lazy Loading: Enhancing Viewability and Revenue for Publishers
Want to know how much you could benefit from Lazyload? Use our calculator to find out!
Start Calculating!
Book a Call

Introduction to Lazyload

The goal of many publishers is to offer the best user experience, provide quality content and make some decent revenue out of his website. There are several optimizations that a publisher can look into. One such feature is Lazy Loading. 

What is Lazy Loading?

Lazy Loading is also known as Just-In-Time Loading or  Smart Loading. This feature in online advertising postpones sending the ad request to an ad slot. It will make sure that ads are being loaded and displayed only when they are most likely to be seen by the user. 

Generally, when the browser requests a web page, we can see simultaneous loading of the entire page and all the ads, irrespective of whether the user is likely to view those ads. By using this Lazy loading, such ads which load at the bottom can be stopped from loading during the page load time and those ads are only loaded when they come into the viewport of the user. 

  • For instance, if a web page has 8 ad slots but only 4 are visible initially (Above the Fold), lazy loading ensures that the remaining 4 ad slots will load as soon as the ad slots comes nearer to the viewport.
  • Lazy loading helps to not  load ads which the user will never see, which could potentially stop decreasing the viewability.
Lazy Loading: Enhancing Viewability and Revenue for Publishers

Implement lazy loading only for ‘Below the Fold’. There’s no point in using lazy loading for ads ‘Above the Fold’, as they are the first elements users interact on your webpage.

Types of Lazy Loading:

  • Pixel Type Loading: Here, we define a specific Pixel offset so that when a user comes near to those designated pixels, ad requests will be sent and thereby displaying ads.

Example: If Lazyload is fixed to 300 pixels, then the ad request sent to the user is 300 pixels away from the ad slot while scrolling up the webpage.

  • Viewport Type Lazy loading: With this approach, a request is sent to load an ad only when the ad slot comes into the user’s viewport and ensures that the ad will be viewed by the user. 

How do we implement Lazy Loading?

There are many methods to implement lazy loading ads, many of which are free and open source on GitHub if you are comfortable with some development work. Javascript Libraries, Intersection Observer API, and loading Attributes are some of the techniques for implementing lazy load. 

Working of Lazy Loading:

Lazy loading defers the loading of ads until the user scrolls down the page and near to the ad slots.

Usually, when a user visits a web page, the browser requests all the required resources at once, causing delays in page load time. But with lazy loading, resources are only loaded when required, reducing the load time. As the user scrolls, additional resources load as they come into view, improving overall performance.

Lazy Loading: Enhancing Viewability and Revenue for Publishers

Advantages of Lazyload

  • High Viewability: Ads will load when users are near to the ad slots which increases the chances of being seen. Any advertiser wants their ads to be seen by the user. So, this technique ensures that ads are displayed to users and do not go wasted if they don’t scroll to their position on the page. 
  • High CPM: Increase in Viewability makes advertisers to pay more for high ad viewability slots. It increases the CPM for those slots which benefits both the advertiser and the publisher. 
  • Increased Revenue: Due to high viewability, Inventory value will increase that leads to more competitive auctions at better rates, particularly for PMPs and Direct Deals. 
  • Reduced Page Latency: Ads will load when the users are near  to the viewport, so requests won’t go from all the ad slots, which improves overall page loading and user experience and drops the page latency. 
  • Low Bandwidth Usage: Only Required Images and Content are loaded which saves bandwidth and improves User experience. 
  • Better SEO: Reduced load times benefit SEO, enhancing search engine rankings and increasing site visibility i.e, It can significantly improve page speed scores, which is crucial for search engine rankings.
    • Improved Speed: Delaying ad loads frees up resources, making the main content load faster.
  • Data Usage: Loading only a few ads will speed up the initial load times and reduce data usage.

Disadvantages of Lazyload

  • Complex Implementation: The main disadvantage of lazy loading lies in its complexity of implementation. It demands significant coding expertise and proficiency which makes it difficult to handle for many individuals with minimal technical skills. 
    • If a publisher has a part- time (outsourced) developer team, finding, researching and deploying the right JavaScript can be a daunting process. 
  • Viewability drop cases: Incorrect implementation of lazy loading ads can lead to significant drop in viewability, which was noted by Google Ad Manager. 
    • Factors like Creative size or ad latency can increase the chances of the ad not being seen at all if the user scrolls faster than the ad can load. . 
  • Drop in Requests & Impressions: By rendering the ads only when needed, we are decreasing  the volume of ad requests to the server, eventually reducing the overall impressions served. 
  • Difficult Split Testing: One more drawback of lazy loading is its difficulty in doing split testing. Since ad viewability requires time to improve and higher bids depend on good viewability, these tests cannot immediately result in higher CPMs. 
  • Damaged User Experience: Misjudging of when and where we want the ad to render can result in negative user experience. 

What is the impact of Lazyload on performance?

  • Requests: One visible change that we can see is the change in Ad requests. Moving from No Lazy load set up to actually implementing it can reduce requests since the Below-The-Fold slots aren’t requested initially. But, Increasing the Lazy Load offset can raise requests. 
  • Page Latency: Lazy load minimizes page latency by only requesting Above-The-Fold slots initially, which leads to faster page loads and good use experiences. 
  • Impressions: As user will be near to the viewport & Reducing Lazy loading,  there are high chances of rise in impressions
  • Viewability: Delay in requests until users are near to the ad slots will increase viewable impressions.
  • CPM: Viewability directly affects CPM rates, high viewability has high ad rates as advertisers are willing to pay more. 

How can Databeat help in this area?

Databeat can help in deciding the optimal lazy load offset at slot level, taking into account changes in relevant KPIs i.e., fixing the best pixel dimensions with controlled drop in Requests. Databeat can suggest better ways to yield optimal revenue and maximize the use of available inventory out of the changes. 

Book a Meeting