[CẬP NHẬT] Lazyload và trì hoãn Adsense 2021 với thuộc tính Crossorigin

Cải thiện tốc độ tải trang khi blog có sử dụng tập lệnh Adsense của Google là vấn đề nan giải cho các tín đồ blogger. Sử dụng nguyên bản link js adsense thì sự ảnh hưởng của nó tới tốc độ tải trang là rất lớn, sử dụng Scroll và Defer lại lo lắng cho hiệu suất của thu nhập quảng cáo.

Gần đây Adsense đã thay đổi lại mã tập lệnh Adsense JS 2021 bằng cách thêm thuộc tính crossorigin. Do vậy cần cập nhật tập lệnh lazyload Adsense-(scroll) và Adsense trì hoãn để phù hợp với những thay đổi mới nhất đối với mã tập lệnh Adsense.

Thuộc tính Crossorigin

Nhưng trước đó, chúng ta hãy tìm hiểu một chút về thuộc tính crossorigin. Thuộc tính crossorigin này áp dụng cho các tài nguyên được tải hoặc yêu cầu từ các miền khác bên ngoài miền của chúng ta, tất nhiên là để bảo mật.

Đây là mã tập lệnh Adsense 2021 mới nhất:

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxxxxxxxxxxx" crossorigin="anonymous"></script>

Sử dụng các mã bên dưới để tải và hoãn lại Adsense mới nhất năm 2021.

Lazyload Adsense(scroll) mới nhất 2021

Chỉ tải javascript khi cuộn trang.
Dán mã sau và lưu nó ở trên </body>

<script>
//<![CDATA[
var lazyadsense = false;
window.addEventListener("scroll", function(){
if ((document.documentElement.scrollTop != 0 && lazyadsense === false) || (document.body.scrollTop != 0 && lazyadsense === false)) {
(function() { var ad = document.createElement('script'); ad.setAttribute('crossorigin','anonymous'); ad.async = true; ad.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxxxxxxxxx'; var sc = document.getElementsByTagName('script')[0]; sc.parentNode.insertBefore(ad, sc); })();
lazyadsense = true;
  }
}, true);
//]]>
</script>

Thay xxxxxxxx bằng mã ID nhà xuất bản.

Adsense Defer(trì hoãn tải) mới nhất 2021

Cách 1:

Thêm tập lệnh sau vào trước </head>

<script>/*<![CDATA[*/ /*@shinsenter/defer.js*/
!function(c,i,t){var f,o=/^data-(.+)/,u='IntersectionObserver',r=/p/.test(i.readyState),s=[],a=s.slice,d='lazied',n='load',e='pageshow',l='forEach',m='hasAttribute',h='shift';function p(e){i.head.appendChild(e)}function v(e,n){a.call(e.attributes)[l](n)}function y(e,n,t,o){return o=(o=n?i.getElementById(n):o)||i.createElement(e),n&&(o.id=n),t&&(o.onload=t),o}function b(e,n){return a.call((n||i).querySelectorAll(e))}function g(t,e){b('source',t)[l](g),v(t,function(e,n){(n=o.exec(e.name))&&(t[n[1]]=e.value)}),e&&(t.className+=' '+e),n in t&&t[n]()}function I(e){f(function(o){o=b(e||'[type=deferjs]'),function e(n,t){(n=o[h]())&&(n.parentNode.removeChild(n),(t=y(n.nodeName)).text=n.text,v(n,function(e){'type'!=e.name&&(t[e.name]=e.value)}),t.src&&!t[m]('async')?(t.onload=t.onerror=e,p(t)):(p(t),e()))}()})}(f=function(e,n){r?t(e,n):s.push(e,n)}).all=I,f.js=function(n,t,e,o){f(function(e){(e=y('SCRIPT',t,o)).src=n,p(e)},e)},f.css=function(n,t,e,o){f(function(e){(e=y('LINK',t,o)).rel='stylesheet',e.href=n,p(e)},e)},f.dom=function(e,n,t,o,i){function r(e){o&&!1===o(e)||g(e,t)}f(function(t){t=u in c&&new c[u](function(e){e[l](function(e,n){e.isIntersecting&&(n=e.target)&&(t.unobserve(n),r(n))})},i),b(e||'[data-src]')[l](function(e){e[m](d)||(e.setAttribute(d,''),t?t.observe(e):r(e))})},n)},f.reveal=g,c.Defer=f,c.addEventListener('on'+e in c?e:n,function(){for(I();s[0];t(s[h](),s[h]()))r=1})}(this,document,setTimeout),function(e,n){e.defer=n=e.Defer,e.deferscript=n.js,e.deferstyle=n.css,e.deferimg=e.deferiframe=n.dom}(this); /*]]>*/</script>
    <script id='polyfill-js'>&#39;IntersectionObserver&#39;in window||document.write(&#39;&lt;script src=&quot;https://polyfill.io/v3/polyfill.min.js?features=IntersectionObserver&quot;&gt;&lt;\/script&gt;&#39;);</script>
    <!--[ Defer Adsense script use shinsenter/defer.js ]-->
  <script type='deferjs' src='https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-0000000000000000' crossorigin='anonymous'/>

Thay 000000000000 là mã nhà xuất bản của bạn.

Cách 2:

Dán mã sau và lưu nó ở trên </body>

<script>
//<![CDATA[
function downloadJSAtOnload(){var d=document.createElement("script");d.src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxxxxxxxxxx";d.setAttribute("crossorigin","anonymous"),document.body.appendChild(d)}window.addEventListener?window.addEventListener("load",downloadJSAtOnload,!1):window.attachEvent?window.attachEvent("onload",downloadJSAtOnload):window.onload=downloadJSAtOnload;
//]]>
</script>

Thay xxxxxxxx bằng mã ID nhà xuất bản.
Để trì hoãn Adsense cần thêm tải trước Adsense JS bên dưới <head>

<link as='script' crossorigin='anonymous' href='https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxxxxxxxxx' rel='preload'/>

Thay xxxxxxxx bằng mã ID nhà xuất bản.