The Latest Way to Speed ​​Up Loading Adsense Ads - By default for Adsense ads that use asynchronous ads will appear after all page elements are loaded. If the loading page is slow, then loading Adsense ads will be even slower.

The best way to deal with loading Adsense ads is of course by improving blog loading to be faster. The faster the blog page loads, the faster Adsense ads will appear.

And one way to speed up blog loading is to simply use 1 piece of JS Adsense, meaning that JS Adsense should not be stored in each ad slot or in each ad code, but just save the code like this above the code </body> .

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

That way, the browser will load an JS Adsense only so that page loading becomes faster.

Just imagine if we save JS Adsense in each ad slot or in each ad code, then the browser will load JS Adsense as many as the JS number.

And now I will share the latest ways to speed up loading of AdSense ads. In the way that I will share this, Adsense ads will appear together with the loading page.

The trick is to use <link rel="preload external nofollow noreferrer"> for JS Adsense. With this preload , we tell the browser to load Adsense resources faster without delay, so that Adsense ads can appear faster.

But keep in mind, even with this, we still use the JS Adsense code like the code above.

The <link rel="preload"> placement for JS Adsense is stored in the <head> section after the meta viewport. The following is the code:

  <link as='script' href='https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js' rel='preload'/> 

The appearance as an example like this:

  <!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width,minimum-scale=1"/>
    <meta name="description" content="This is Description"/>
   
<link as='script' href='https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js' rel='preload'/>
    <style>
      /* Add your styles here */
    </style>
    <link rel="canonical" href="."/>
    <title>My Page</title>
  </head>
  <body>
    <h1>Hello World</h1>
    <script async='async' src='//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'/>
  </body>
</html>

But if you use Adsense lazyload , then you don't need to use this trick.

And for AMP HTML use the following code:

  <link as='script' href='https://cdn.ampproject.org/v0/amp-ad-0.1.js' rel='preload'/>
<link as='script' href='https://cdn.ampproject.org/v0/amp-auto-ads-0.1.js' rel='preload'/>

And examples of appearances like the following:

  <!doctype html>
<html amp="amp" lang="en">
  <head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width,minimum-scale=1"/>
    <meta name="description" content="This is the AMP Boilerplate."/>
    <link rel="preload" as="script" href="https://cdn.ampproject.org/v0.js"/>
   
<link as='script' href='https://cdn.ampproject.org/v0/amp-ad-0.1.js' rel='preload'/>
    <link as='script' href='https://cdn.ampproject.org/v0/amp-auto-ads-0.1.js' rel='preload'/>
    <link rel="preconnect dns-prefetch" href="https://fonts.gstatic.com/" crossorigin=""/>
    <script async src="https://cdn.ampproject.org/v0.js"></script>
    <script async='async' custom-element='amp-ad' src='https://cdn.ampproject.org/v0/amp-ad-0.1.js'/>
    <script async='async' custom-element='amp-auto-ads' src='https://cdn.ampproject.org/v0/amp-auto-ads-0.1.js'/>
    <!-- Import other AMP Extensions here -->
    <style amp-custom>
      /* Add your styles here */
    </style>
    <link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet"/>
    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible.selected}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible.selected}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible.selected}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible.selected}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible.selected}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
    <link rel="canonical" href="."/>
    <title>My AMP Page</title>
  </head>
  <body>
    <h1>Hello World</h1>
  </body>
</html>

For bloggers who say that the AMP ADS ad loading is late, try this trick to speed up the loading of the ad.

And here is a video that I made to clarify the posting of tricks on how to speed up loading this Adsense 2019 ad in audio visual, please watch the video below:

Done, hopefully useful.


The Latest Way to Speed ​​Up Loading Adsense Ads