How to avoid Google Ads from slowing down my site (Especially Mobile)?

Question

I know that many webmasters believe that page speed means nothing. However, I’m confident that this factor is one of TOP 3 in the Google’s decision of ranking any website.

I tired of seeing how Google’s own services are slowing down my pages. I write clean code. When I launch any website/app, it scored “A” on GTMetrix and Pingdom and 100/100 on Google Page Speed (Mobile). As a rule, Google Ads don't harm the desktop version.

However, once I add at least one Google Ad, my ranking drops down to “C” and 60-67/100 (Mobile).

Of course, one may say that Page Speed is not an SEO ranking factor. Ok, for NYT, WSJ, Bustle, HuffPost, etc., may be. But for any new website, the speed is a crucial factor.

The injustice is that Google point out its own services, which slow down my (and your) projects, such as:

There are 6 static components without a far-future expiration date.

https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js
https://code.jquery.com/jquery-3.3.1.min.js (not Google)
https://adservice.google.ca/adsid/integrator.js?domain=xxx
https://adservice.google.com/adsid/integrator.js?domain=xxx
https://pagead2.googlesyndication.com/pub-config/r20160913/ca-pub- 
xxx.js
https://fonts.googleapis.com/css? 
family=Open+Sans:400,700|Roboto:700&lang=en

Reduce DNS lookups:

pagead2.googlesyndication.com: 6 components, 368.9K (136.4K GZip)
code.jquery.com: 1 component, 86.9K (30.2K GZip)
adservice.google.ca: 1 component, 0.1K (0.1K GZip)
adservice.google.com: 1 component, 0.1K (0.1K GZip)
googleads.g.doubleclick.net: 11 components, 173.4K (45.9K GZip)
fonts.googleapis.com: 1 component, 7.0K (0.6K GZip)
tpc.googlesyndication.com: 5 components, 153.0K (57.0K GZip)
www.google.com: 1 component, 0.2K

Avoid URL redirects:

https://www.google.com/pagead/drt/ui redirects to 
https://googleads.g.doubleclick.net/pagead/drt/si

Reduce JavaScript execution time:

/pagead/ads?client=…(googleads.g.doubleclick.net)
/pagead/ads?client=…(googleads.g.doubleclick.net)
…js/adsbygoogle.js(pagead2.googlesyndication.com)
…r20100101/osd.js(pagead2.googlesyndication.com)
…r20180604/show_ads_impl.js(pagead2.googlesyndication.com)
…activeview/osd_listener.js(tpc.googlesyndication.com)

etc., etc., etc...

I know that I can’t edit the code on their side. But maybe there is some way to defer Google Ads or do any other trick to reduce the harm of Google’s own services? Is there at least someone who has a 100/100 score on Google Page Speed (Mobile), having 2-3 Google Ads on a page?

Answer 1

I had some tests and a closer look at these issues recently. So have some solution and recommendation related to this.

The main goal is to minimise the impact on your site speed and move all the conversion and 3rd party scripts to lower priority load, for example, add them in the footer section not on the head as all these services suggest to do. You won't lose much to load these scripts with lower priority from a tracking and analytics perspective. Probably, you will increase a little bit possible that some of the conversion won't be tracked and will be missed on your reports but at the same time, you will improve the site speed for all users. An exception would be to keep Google Analytics or Google Tag Manager in the head as this could be higher priority and important from functionality and tracking perspective.

Another important and good practice is to review and remove all the tags where you don't have active campaigns and keep on the website only these tracking scripts what is important from a marketing and tracking perspective and what makes sense.

My recommended method to control all these 3rd party scripts is to use Google Tag Manager and manage all these tags thought it.

How to optimise site speed when using 3rd party scripts with Google Tag Manager:

1. Prioritise all your script loading and order them by priorities

Use Google Tag Manager's page view trigger to fire tags when pages are loaded in web browsers. There are three trigger types that track page load events, and each type has slightly different criteria to determine when the trigger should fire a tag:

Page View: Fires immediately when the web browser begins to load a page. Use this option if you only need data generated from page impressions.

DOM Ready: Fires after the browser has finished constructing the full page in HTML and the Document Object Model (DOM) is ready to be parsed. Pageview-based tags that interact with the DOM to populate variables should use this trigger type to ensure that the correct values are available to Tag Manager.

Window Loaded: Fires after the page has fully loaded, including any embedded resources such as images and scripts.

To create a new page view trigger:

1. Click Triggers and then New.
2. Click Trigger Configuration and choose a page view trigger type.

3. Optional, but recommended to improve performance: Specify conditions (usually a URL pattern) for pages where you expect a click to occur:

   • Under the heading "This trigger fires on", select "Some Events".
   • Under "Fire this trigger when an Event occurs and all of these conditions are true", add a filter to enable this trigger only on pages that require it, e.g. Click URL contains /path/to/promo.

4. Save the trigger and publish.

Source: https://support.google.com/tagmanager/answer/7679319?hl=en

I recommended using Page View trigger only for the most important tags, for example, Google Analytics. For all other tags, you should use at least DOM Ready or more likely Page Loaded triggers. Using Page Loaded trigger will give the less impact on your site speed for all these 3rd party tags but you will increase the possibility that some of the conversions won't' be tracked if the users close Thank You page sooner then the tracking script is loaded.

Sometimes scripts like HotJar or similar heatmap scripts should be used with Page View script as well to increase accuracy for these analytics data.

If you add some chat or support tools on your website, then for these scripts should use the Page Loaded trigger as well.

2. Review and update the scripts as necessary.

You should review, change or put on Pause the tags what you are not using or these 3rd party tools don't have any active campaigns.

Use Resource Hints: DNS Prefetch and/or Preconnect

Additionally, you should use these resources hints for all of your 3rd party resources what is loaded from another domain. As both are not supported for the same browsers, I would recommend using both of them.

In short, you should use these for all the domains what's mentioned under Reduce DNS Lookups.

The code what you should add on your head, should look like this:

<!-- Prefetch DNS for external assets -->
 <link rel="dns-prefetch" href="//fonts.googleapis.com">
 <link rel="dns-prefetch" href="//www.google-analytics.com">
 <link rel="dns-prefetch" href="//cdn.domain.com">

<!-- Preconnect for external assets -->
 <link rel="preconnect" href="//fonts.googleapis.com" crossorigin>
 <link rel="preconnect" href="//www.google-analytics.com" crossorigin>
 <link rel="preconnect" href="//cdn.domain.com" crossorigin>