Tagging best practices to minimize page latency

Call GPT early

Request the GPT library as early as possible to give the browser time to fetch and execute the dependent libraries (for example, pubads.js). In some cases, loading GPT sooner may have limited gains if many higher priority requests or blocking resources are requested between the time GPT and pubs are requested.

Use asynchronous mode with single request architecture (SRA)

Asynchronous mode enables your content and ads to load independently, instead of loading content and ads together in sequence. Each ad renders within an iframe that’s reserved on the page until the ad is ready to display. If a creative is slow in loading, your content does not need to wait. Learn about GPT request and rendering modes

With single request architecture (SRA), all ad requests for a page view are sent to Ad Manager at one time from the header of your content, which can improve your page’s loading speed.

Place tags directly on the page

When possible, put tags directly on a page rather than inside another JavaScript file that needs to be downloaded. The latter approach can cause delays in the ad server flow and interfere with content loading if the original script is synchronous. 

Avoid common GPT implementation mistakes

Review the following common implementation mistakes described in the GPT developer documentation:

  • Relying on gpt.js script tag listeners
  • Checking the googletag object to know whether GPT is ready
  • Relying on obfuscated code syntax
  • Overwriting any function or variable of GPT
  • Mis-ordering calls to GPT
  • Misusing closures and JavaScript variable scoping

Use AMP and serve mobile-optimized creatives

Implement Ad Manager on AMP (Accelerated Mobile Pages) to monetize your fast-loading pages. Learn how to generate AMP ad tags

Creative latency is one of the biggest causes of poor ad performance. Avoid heavy creatives; follow industry guidelines such as on pages 5-6 of the IAB Mobile Advertising Guidelines.

Practice good page performance

Overall page performance can have a large impact on ad latency.

  • Avoid render-blocking CSS and parser-blocking JavaScript, as these can stall and postpone asset requests, including ads. Ads are not requested until the .display() method is called: parser-blocking JavaScript can stall this from happening.
    • Use fewer separate CSS resources, and make the ones you do use smaller.
    • Make sure not to load CSS resources that are not used by the page.
    • Use media queries on your CSS links to ensure that only CSS relevant to the target device/mode is being downloaded. (for example, separate portrait orientation, landscape orientation, and print resources, and use media queries to ensure that only the orientation for the current device mode is downloaded).
  • Focus on above-the-fold content; on mobile devices, bandwidth is limited. Downloading too much at once can cap out bandwidth and cause assets to download slower than usual

When GPT determines that a page is not visible, it only requests and renders above-the-fold ads. This is so that:

  • Ad slots visible in the first viewport will not be blank rectangles if/when the page becomes visible.
  • Signals need for pageview counting are still sent correctly.

Simplify the DOM structure

The <div> tag where ad needs to show is part of the DOM. We recommend maintaining a simple HTML structure with few DOM elements, so that the ad call can be made as soon as possible.

Was this helpful?
How can we improve it?