网站页面添加 Google AdSense 后页面加载慢?

soゝso 2019-01-16 02:19:23 586

Google AdSense我使用的方法

在下亲妹妹反馈,我网站有时候打开很慢。这个必须重视,看到  Google AdSense  是罪魁祸首后,我稍微优化了下。下面是广告模块的定义内容,View是  Freemarker   方便  Macro  的引用。


页面上我就很方便得使用。

<@n_ad._300x250/>
<@n_ad._300x250/>
<@n_ad._300x250/>
<@n_ad.auto/>

废话不多说。 Google AdSense 推荐给我们的格式是:

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

<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-5366069415012676"
     data-ad-slot="4650889201"
     data-ad-format="auto"></ins>
<script>
    (adsbygoogle = window.adsbygoogle || []).push({});
</script>

相信开始做 Google AdSense 的朋友有一样的感受,就是是不是一个页面多个广告,每个广告要同样引用一个“adsbygoogle.js”文件呢?

答案是不用的。

Google AdSense阻碍页面加载的解决办法

用了一个  jQuery  的一个ready事件。

 $('script#_ad').length == 0 ? (function (a,d) {
    var s = d.createElement('script');
    s.src = a;
    s.id = '_ad';
    s.setAttribute('async','');
    var s0 = d.getElementsByTagName("script")[0];
    s0.parentNode.insertBefore(s, s0);
})('//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js',document) : void 0;

效果不好?你甚至可以再用setTimeout再包裹起来,延迟个几秒再加载。最佳延迟3秒。

//ad
setTimeout(function () {
    $('script#_ad').length == 0 ? (function (a) {
        var s = so.d.createElement('script');
        s.src = a;
        s.id = '_ad';
        s.setAttribute('async','');
        var s0 = so.d.getElementsByTagName("script")[0];
        s0.parentNode.insertBefore(s, s0);
    })('//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js') : void 0;
},3e3);

OK了,截止发稿前,还没上线,卡了一个大版本。

版权所属:SO JSON在线解析

原文地址:https://www.sojson.com/blog/314.html

转载时必须以链接形式注明原始出处及本声明。

本文主题:

如果本文对你有帮助,那么请你赞助我,让我更有激情的写下去,帮助更多的人。

相关文章
SOJSON动态云端加载,HTML5页面源码(下),SOJSON特效
sojson 特效,本站页面“线条”HTML5实现讲解、特效代码下
Shiro 教程,Ajax请求拦截跳转页面方案
Elasticsearch 添加失败 MapperParsingException[object mapping for [] tried to parse field [null] as object, but found a concrete value
SOJSON首的圣诞雪花特效,特效分享,雪花特效下
Freemarker静态化加载模板的三种方式
Javascript模块化编程,本站使用 require.js 优化JS加载, require.js下
IOS 中 urldecode 如何解码,解码“+”(加号)和空格处理方式
Java web.xml 配置技巧—动态欢迎地址
Elasticsearch教程(九) elasticsearch 查询数据 | 分查询
最新文章
记一次小失误导致的大事件,Mysql SQL Error: 0, SQLState: null 排查过程 39
Springboot Maven 增加本地依赖包,Springboot Maven打包本地包 81
Java 获取图片属性、获取图片EXIF属性操作方法[metadata-extractor] 41
又拍云(Upyun)CDN、云存储刷新链接缓存,API实例讲解 77
Linux Centos 使用 Redis service 启动,Redis service 脚本编写 111
恭喜SOJSON获得阿里云618“上云接力赛”第一名,获得代金券6.18万 329
Springboot 集成Freemarker 自定义标签解决方案 922
七牛云怎么样?七牛云到底有多垃圾?用七牛云需要知道的事,不然不小心就一套房没了 29339
JavaScript怎么识别360浏览器?JS识别360急速模式方案,360流氓浏览器 1236
关于本站所有JavaScript 加密、混淆、解密、美化等安全说明 2322
最热文章
免费天气API,全国天气 JSON API接口,可以获取五天的天气预报 181970
我为什么要选择RabbitMQ ,RabbitMQ简介,各种MQ选型对比 147888
Elasticsearch教程(四) elasticsearch head 插件安装和使用 141500
苹果电脑Mac怎么恢复出厂系统?苹果系统怎么重装系统? 94439
Elasticsearch教程(六) elasticsearch Client创建 82816
Elasticsearch教程(一),全程直播(小白级别) 79684
Elasticsearch教程(二),IK分词器安装 78072
Elasticsearch教程(八) elasticsearch delete 删除数据(Java) 77403
Elasticsearch教程(五) elasticsearch Mapping的创建 71312
免费天气API,天气JSON API,不限次数获取十五天的天气预报 65831

骚码加入我们 / 千人QQ群:259217951

入群需要5元,如果没有QQ钱包,可以先Alipay、微信,赞助然后加群主拉进。

二维码生成 来自 >> 二维码生成器

支付扫码

所有赞助/开支都讲公开明细,用于网站维护:赞助名单查看

正在加载... ...