Question

152

How to run code (Google/Doubleclick Ads) without block main thread

rated 0 times [ 153] [ 1] / answers: 1 / hits: 6673 / 5 Years ago, tue, november 26, 2019, 12:00:00

Is there any way to run Google Ads code without block main thread? Google Pagespeed Insights shows me a warning Reduce the impact of third-party code: Third-party code blocked the main thread for ...

Third-Party                   Size         Main-Thread Blocking Time

Google/Doubleclick Ads        193 KB       253 ms

I've placed a script to the end of the page in the footer.

<script data-ad-client=ca-pub-xxx async src=https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js></script>

I tried to add data-aload data-original=... but it doesn't help. Maybe it would a right choice to use requestAnimationFrame() or setTimeOut(), but I don't know how to implement it on this.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

stefanicarolinat

Add To Favorites

Follow

Total Points: 145

Total Questions: 91

Total Answers: 93

Location: Cambodia

Member since Thu, Oct 7, 2021

3 Years ago

stefanicarolinat questions

1 Cannot fetch data from localhost using Sveltekit

Mon, Nov 15, 21, 00:00, 3 Years ago

1 Add nonce to script tag

Fri, Apr 16, 21, 00:00, 3 Years ago

1 How do you input an ASCII art image into the console in JS?

Thu, Oct 15, 20, 00:00, 4 Years ago

1 jest: How to teardown after (just) an individual test

Fri, Jul 17, 20, 00:00, 4 Years ago

1 How can I use fs.createReadstream with fs.promises

Fri, May 10, 19, 00:00, 5 Years ago

View All

answered 5 Years ago kalli · Accepted Answer

You can add script dynamically. NB there is no need to add async since browser considers all dynamic script async by default

const loadScript = (src, id, callback) => {

    const script = document.createElement('script');

    script.src = src; // URL for the third-party library being loaded.

    script.id = id; // e.g., googleMaps or stripe

    script.defer = true; // make sure that browser will run script after page loaded

    document.body.appendChild(script);



    script.onload = () => {

      if (callback) callback(); // conditional callback

    };

};