为了让我的小破站能够勉强的活下去,于是接入了谷歌广告,完全为了解决服务器的一些开支问题。

如果您是一个挥金如土的大佬,不妨点击文末的赞赏,对小弟进行“施舍”;

如果您像我一样,是个穷屌丝,那也希望您可以点一下网站中的小广告,对我支持!!

好了步入正题

1.字体优化加速

我们都知道谷歌在国内基本不能访问,如果还加载谷歌字体,那就没戏了,速度肯定上不去;那么我们就修改一下字体,把那个广告单元中的字体改为Arial,已经创建了广告单元,那就去修改一下即可。

image-20210329123457896

2.减少代码中的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>

代码是通过async异步请求加载adsbygoogle.js核心文件,待加载完成后再push到ins内,显示广告内容。而谷歌广告联盟(Google AdSense)在国内的节点少之又少,时常抽风。当网站加载广告出现加载慢的情况时,网站就会一直处于加载状态,从而拖慢网站加载速度。

如果网站有多个广告单元,那就可以把该段引入JS的代码放在head内,既可以达到只需一次载入JS 即可让所有广告单元显示广告。

3.js监听加载

用懒加载的方式加载 adsbygoogle.js 核心文件,建议将下列代码部署至</body>之前即可。

<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>

代码是让广告在网站载入完成后才开始加载,让谷歌广告联盟(Google AdSense)加载慢的问题无法影响网站加载速度。

如果觉得我的文章对你有用,请随意赞赏