技术分享|解决谷歌联盟广告代码拖慢网站加载速度

由于谷歌服务在国内的节点比较少，谷歌的一些JS加载速度经常抽风，有时候需要几十秒的时间来加载，在博客接入谷歌广告联盟之后，经常在打开页面的时候网页标签一直显示加载状态，对访客非常不友好。

具体的解决方式是在页面加载完成后再异步加载谷歌联盟的JS，这样的话在JS加载慢的时候，虽然广告显示也会变慢，但是不会影响用户的浏览，不能因为广告影响使用者的体验。

谷歌原生代码：

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js">
</script>
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-id"
data-ad-slot="id"
data-ad-format="auto"
data-full-width-responsive="true">
</ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

修改后的代码：

<script>
window.onload = function() {
setTimeout(function() {
let script = document.createElement("script");
script.setAttribute("async", "");
script.src = "//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";
document.body.appendChild(script);
}, 2e3);
}
</script>
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-id"
data-ad-slot="id"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>