Hiện tại chỉ số PageSpeed Insights không hẳn là thước đo tốc độ load nhanh hay chậm của một website mà đã được Google đánh giá là chỉ số quan trọng, nó chính là thước đo cho tính khả dụng trên thiết bị di động.
Và để cạnh tranh nhau trong kết quả tìm kiếm của Google các nhà sở hữu web/blog đều đang cố gắng cải thiện chỉ số này.
Chỉ số PageSpeed Insights bị kéo xuống quá thấp(đỏ) là khi ta sử dụng các link javascript của Google Adsense, Google Analytics và Facebook cài đặt trong trang.
Giải pháp: Để khắc phục chỉ số PageSpeed Insights ta sử dụng mẹo chỉ khi cuộn trang (scroll) thì các ứng dụng của bên thứ ba mới hoạt động (load).
Chỉ tải khi cuộn trang(scroll)
1- Với Google Analytics.
Sử dụng Googletagmanager-gtag
Ví dụ
<script>
window.addEventListener('load', function() {
var is_load = 0
function loadanalytics() {
if (is_load == 0) {
is_load = 1
var an = document.createElement('script')
an.async = true;
an.src = 'https://www.googletagmanager.com/gtag/js?id=UA-123456789'
var sc = document.getElementsByTagName('script')[0]
sc.parentNode.insertBefore(an, sc);
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag('js', new Date());
gtag('config', 'UA-123456789');
}
}
window.addEventListener('scroll', function() {
loadanalytics()
})
})
</script>Các bạn thay ID Analytics của các bạn vào 2 vị trí có ID 123456789 bên code trên và lưu lại.
2- Với Facebook
Để cải thiện mã JS thêm vào website của Facebook các bạn dùng code sau:
Ví dụ
<script>
window.addEventListener('load', function() {
var is_load = 0
function loadfb() {
if (is_load == 0) {
is_load = 1
var an = document.createElement('script')
an.async = true;
an.src = 'https://connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v10.0&appId=123456789'
var sc = document.getElementsByTagName('script')[0]
sc.parentNode.insertBefore(an, sc)
}
}
window.addEventListener('scroll', function() {
loadfb()
})
})
</script>Các bạn thay app_id của các bạn vào.
3- Với Google Adsense.
1- Dán file sau vào giữa thẻ <head> </head>
Ví dụ
<link as='script' href='https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js' rel='preload'/>2- Dùng 1 trong các code sau dán vào trước </head>
Code 1
<script>
window.addEventListener('load', function() {
var is_load = 0
function loadads() {
if (is_load == 0) {
is_load = 1
var an = document.createElement('script')
an.async = true;
an.src = '//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'
var sc = document.getElementsByTagName('script')[0]
sc.parentNode.insertBefore(an, sc)}}
window.addEventListener('scroll', function() {loadads()})})
</script>
<script>
//<![CDATA[
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-123456789",
enable_page_level_ads: true
});
//]]>
</script>Code 2
<script>
window.addEventListener("load", function() {
var is_load = 0
function loadads() {
if (is_load == 0) {
is_load = 1
var an = document.createElement('script')
an.async = true;
an.src = "//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"
var sc = document.getElementsByTagName("script")[0]
sc.parentNode.insertBefore(an, sc)
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-12345678912345",
enable_page_level_ads: true
});
}
}
window.addEventListener("scroll", function() {
loadads()
})
})
</script>Code 3
<script>
//<![CDATA[
window.addEventListener("load", function() {
var e = 0;
window.addEventListener("scroll", function() {
! function() {
if (0 == e) {
e = 1;
var a = document.createElement("script");
a.async = !0, a.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";
var n = document.getElementsByTagName("script")[0];
n.parentNode.insertBefore(a, n), (adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-1234567890",
enable_page_level_ads: !0
})
}
}()
})
});
//]]>
</script>
Thay 123456789 thành mã ID nhà xuất bản của bạn.Và khi cài đặt code từng mã quảng cáo bạn bỏ file js trong mã đó đi.
Ví dụ mã Google Adsense đầy đủ có dạng:
Ví dụ
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- sidebar2 -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-123456789"
data-ad-slot="xxxxxxxxx"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>Ta bỏ file js sẽ có dạng:
Ví dụ
<!-- sidebar2 -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-123456789"
data-ad-slot="xxxxxxxxx"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>Tải trễ sau 3 giây khi trang chính đã tải xong
Trường hợp này áp dụng cho quảng cáo của Google Adsense, cụ thể khi khách truy cập vào trang web của bạn, quảng cáo sẽ tải sau 3 giây.
Ví dụ
<script>
//<![CDATA[
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-123456789",
enable_page_level_ads: true});
setTimeout(LoadGGAdsense3s, 3000);
function LoadGGAdsense3s() {
var head_ID = document.getElementsByTagName("head")[0];
var script_element = document.createElement('script');
script_element.type = 'text/javascript';
script_element.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js';
head_ID.appendChild(script_element);
}
//]]>
</script>