Tăng tốc Google Tag Manager

tang toc Google Tag Manager Script

Tăng tốc Google Tag Manager

Google Tag Manager là gì?

Google Tag Manager là công cụ cho phép người dùng cập nhật và quản trị các website. Các công việc này bao gồm việc: theo dõi các thẻ tối ưu (Google Optimize, Hotjar, Crazy), Google Analytics, tiếp thị lại (Google Ads, Facebook Ads).

Google Tag Manager và Google Analytics là 2 công cụ khác nhau. Google Tag Manager (GTM) có khả năng điều chỉnh và theo dõi rất nhiều thông số lớn. Trong khi đó, Google Analytics hoạt động dựa trên các số liệu đo lường và được Google Tag Manager cung cấp trên website. Các số liệu của Google Analytics chỉ có giá trị khi được Google Tag Manager cung cấp đầy đủ. Nói cách khác, Google mang giá trị đo lường, Google Tag Manager là quản lý và điều chỉnh.

Nếu bạn đang tìm kiếm một cách để tăng tốc script Google Tag Manager trên trang web WordPress của mình, bạn đã tìm đúng nơi rồi đó. Script Google cung cấp cho chủ sở hữu trang web WordPress để tích hợp một loạt các mã vào trang web thực sự có thể làm chậm tốc độ tải web.

tang toc Google Tag Manager Script

Vấn đề với script Google Tag Manager là gì?

Giải pháp rõ ràng là thêm “tải trì hoãn” vào nội dung, ngụ ý rằng ban đầu nó sẽ xếp chồng lên nhau, khi tất cả những thứ khác trên trang đã hoàn tất quá trình phân tích cú pháp. Làm điều này không tạo ra nhiều khác biệt. Có một số vấn đề xuất hiện khi bạn hoãn xếp chồng script Google Tag Manager. Vấn đề là khách truy cập thực sự có thể rời khỏi trang trước khi Script có cơ hội thực thi đúng cách và nó sẽ không kích hoạt những gì bạn cần được kích hoạt.

Giải pháp để tăng tốc script Google Tag Manager?

Để đảm bảo các phép đo sau đây chính xác nhất trong khi vẫn giữ được điểm Tốc độ trang cao, tôi đã nghĩ đến các điều kiện kèm theo về thời điểm nên thôn tính nội dung Scrip Google Tag Manager

3500 mili giây sau khi báo cáo kết thúc sự kiện DOMContentLoaded

Tại thời điểm khách hàng xem qua trang (Kiểm tra Tốc độ trang không kích hoạt các trường hợp di chuyển chuột / nhấp chuột / di chuyển chuột)

Tại thời điểm khi khách hàng di chuyển chuột trên trang

Tại thời điểm khách hàng liên hệ với bất kỳ vị trí nào trên trang (đối với điện thoại di động)
Điều này dường như xếp chồng các nội dung sau và các bài kiểm tra Tốc độ trang sẽ không bị phạt.

Ngoài ra, nó sẽ hạ thấp biện pháp điều tra thiếu sót, do thực tế là khi khách hàng di chuyển chuột, cuộn hoặc giao diện với trang ở bất kỳ khả năng nào, nội dung sau sẽ được thiết lập ngay lập tức. Chỉ tình huống mà khách sẽ không bị theo dõi, là nếu khách truy cập trang và chọn rời đi trước ~ 3,5 giây và không can thiệp vào trang trong bất kỳ khả năng nào (nhìn qua, di chuyển chuột, v.v.)

Script Google Tag Manager cũ và làm cho web tải chậm

<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','MA-GTM-CHEN-TAI-DAY');</script>
<!-- End Google Tag Manager -->

Cách tối ưu Scrip Google Tag Manager

Dưới đây là các Script được đưa vào Scrip Google Tag Manager cho trang web WordPress mà chúng tôi đã tối ưu hóa . Đây là cách các Script đang thực thi với script Google Tag Manager chuẩn mà Google cung cấp cho bạn để nhúng vào trang web của mình.

ScriptScrip Google Tag Manager mới và được cải tiến

Dưới đây là Script nhúng mới và cải tiến mà bạn sẽ sử dụng để tăng tốc script Google Tag Manager trên trang web wordpress của mình.

Bạn nhớ thay đổi ID trong Script Google Tag Manager nhé.

<script>
document.addEventListener('DOMContentLoaded', () => {
	/** init gtm after 3500 seconds - this could be adjusted */
	setTimeout(initGTM, 3500);
});
document.addEventListener('scroll', initGTMOnEvent);
document.addEventListener('mousemove', initGTMOnEvent);
document.addEventListener('touchstart', initGTMOnEvent);

function initGTMOnEvent (event) {
	initGTM();
	event.currentTarget.removeEventListener(event.type, initGTMOnEvent); // remove the event listener that got triggered
}

function initGTM () {
	if (window.gtmDidInit) {
		return false;
	}
	window.gtmDidInit = true; // flag to ensure script does not get added to DOM more than once.
	const script = document.createElement('script');
	script.type = 'text/javascript';
	script.async = true;
	script.onload = () => { dataLayer.push({ event: 'gtm.js', 'gtm.start': (new Date()).getTime(), 'gtm.uniqueEventId': 0 }); } // this part ensures PageViews is always tracked
	script.src = 'https://www.googletagmanager.com/gtm.js?id=MA-GTM-CHEN-TAI-DAY';

	document.head.appendChild(script);
}
</script>