谷歌AdSense广告代码拖慢网站加载速度的解决方法

谷歌广告(Google Adsense)是许多站长网站的收入来源之一,但有时我们会发现谷歌广告加载很慢,影响网站的整体加载速度。本文将介绍如何优化谷歌广告加载速度,让您的网站加载更快。理论上适用于包括 Google Analytics(谷歌分析)、Google Tag Manager 和 Google AdSense 等的所有广告和统计代码。

2r4EqwCqn1IAXAgtrEC2hQRod43EPLsM3483894.jpg 谷歌AdSense广告代码拖慢网站加载速度的解决方法 站长资源

谷歌广告加载速度慢的原因

谷歌广告加载慢的主要原因是加载了大量的 JavaScript 文件,这些文件需要从谷歌的服务器下载,因此会增加网站的加载时间。

优化谷歌广告加载速度的方法

1、减少代码中的 JS 请求

谷歌广告代码中常见的一个问题是多次加载 adsbygoogle.js 文件,导致加载速度变慢。我们只需要将这个文件放在网站的 <head> 标签中,加载一次 adsbygoogle.js 文件即可:

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

3、优化广告单元

页面中的广告单元不需要再引一遍  adsbygoogle.js 文件,只需要引入单元部分即可。

<ins class="adsbygoogle"
     style="display:inline-block;按照您的样式填写"
     data-ad-client="ca-pub-按照您的代码填写"
     data-ad-slot="4761618262">
</ins>
<script>
  (adsbygoogle = window.adsbygoogle || []).push({});
</script>

3、使用懒加载

懒加载是一种延迟加载技术,可以将网站上的内容分批加载。这样,当用户访问网站时,会先加载当前屏幕上的内容,而其他内容可以在页面加载完时再加载。使用懒加载技术来延迟加载谷歌广告,可以减少网站的初始加载时间。

通过 JS 监听加载的方式,在网站加载完成后再开始加载谷歌广告的 JS,避免广告加载慢影响网站整体加载速度:

<script>
  window.onload = function() {
    let script = document.createElement("script");
    script.setAttribute("async", "");
    script.src = "//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";
    document.body.appendChild(script);
  }
</script>

总结

通过以上方法,我们可以优化谷歌广告的加载速度,让网站加载更快。这样可以提高用户体验,并增加网站的收入。


未经允许不得转载:Web前端开发资源网 » 谷歌AdSense广告代码拖慢网站加载速度的解决方法

推荐阅读:

PhpStorm表单提交时获取不到post数据的解决方法

Vue.js学习笔记——事件监听

利用css中的伪类 给元素设置特殊样式效果

在Webstorm中使用Autoprefixer实现CSS自动补全

利用CSS设置图片黑白/灰色效果,同时适用于整站变灰

赞 (1)
分享到: +

评论 沙发

Avatar

换个身份

  • 昵称 (必填)
  • 邮箱 (选填)