วัดระยะเวลาของผู้ใช้ด้วย gtag.js

การลดเวลาในการโหลดหน้าเว็บช่วยปรับปรุงประสบการณ์โดยรวมของผู้ใช้เว็บไซต์ หน้านี้จะอธิบายวิธีส่งข้อมูลเวลาของผู้ใช้ไปยัง Google Analytics

การใช้งาน

ใช้คำสั่ง event เพื่อส่งเหตุการณ์ timing_complete

gtag('event', 'timing_complete', {<timing_parameters>});

โดย <timing_parameters> คือคู่พารามิเตอร์-ค่าอย่างน้อย 1 คู่ คั่นแต่ละคู่ด้วยคอมมา เช่น คำสั่งนี้จะส่งเหตุการณ์การจับเวลาของผู้ใช้ไปยัง Google Analytics เพื่อระบุว่าหน้าเว็บปัจจุบันใช้เวลา 3, 549 มิลลิวินาทีในการโหลดทรัพยากร Dependency ของ JavaScript ภายนอกทั้งหมด

gtag('event', 'timing_complete', {
  'name' : 'load',
  'value' : 3549,
  'event_category' : 'JS Dependencies'
});

พารามิเตอร์ระยะเวลาของผู้ใช้

ตารางนี้สรุปพารามิเตอร์ระยะเวลาของผู้ใช้ ดังนี้

ชื่อพารามิเตอร์	ประเภทข้อมูล	จำเป็น	คำอธิบาย
name	string	มี	สตริงสำหรับระบุตัวแปรที่กําลังบันทึก (เช่น 'load')
value	integer	มี	จำนวนมิลลิวินาทีในเวลาที่ผ่านไปในการรายงานไปยัง Google Analytics (เช่น 20)
event_category	string	ไม่มี	สตริงสำหรับจัดหมวดหมู่ตัวแปรด้านเวลาของผู้ใช้ทั้งหมดเป็นกลุ่มเชิงตรรกะ (เช่น 'JS Dependencies')
event_label	string	ไม่ได้	สตริงที่ใช้เพื่อเพิ่มความยืดหยุ่นในการแสดงภาพระยะเวลาของผู้ใช้ในรายงาน (เช่น 'Google CDN')

ระยะเวลาการวัด

เหตุการณ์ timing_complete ต้องมีพารามิเตอร์ value ที่ระบุเวลาที่ผ่านไปเป็นมิลลิวินาที คุณต้องเขียนโค้ดที่บันทึกค่านี้

วิธีที่ง่ายที่สุดในการดำเนินการนี้คือการสร้างการประทับเวลาที่จุดเริ่มต้นของช่วงเวลาและสร้างการประทับเวลาอีกครั้งที่ส่วนท้ายของช่วงเวลา จากนั้นคำนวณเวลาที่ผ่านไประหว่างการประทับเวลา

เบราว์เซอร์ที่ทันสมัยส่วนใหญ่รองรับ Navigation Timing API ซึ่งรวมถึงเมธอดในออบเจ็กต์ window.performance สำหรับการวัดประสิทธิภาพของหน้าเว็บผ่านข้อมูลเวลาที่มีความละเอียดสูง

ตัวอย่างต่อไปนี้ใช้เมธอด performance.now() ซึ่งจะแสดงผลระยะเวลาที่ผ่านไปตั้งแต่หน้าเว็บเริ่มโหลดเป็นครั้งแรก

// Feature detects Navigation Timing API support.
if (window.performance) {
  // Gets the number of milliseconds since page load
  // (and rounds the result since the value must be an integer).
  var timeSincePageLoad = Math.round(performance.now());

  // Sends the timing event to Google Analytics.
  gtag('event', 'timing_complete', {
    'name': 'load',
    'value': timeSincePageLoad,
    'event_category': 'JS Dependencies'
  });
}

การพิจารณาการสุ่มตัวอย่าง

Google Analytics จะสุ่มตัวอย่างเหตุการณ์ระยะเวลาเพื่อให้แน่ใจว่ามีการกระจายทรัพยากรระบบอย่างเท่าเทียมสำหรับฟีเจอร์นี้

อัตราในการสุ่มตัวอย่างเหตุการณ์ในช่วงเวลานั้นพิจารณาจากจำนวนการดูหน้าเว็บทั้งหมดที่ได้รับในวันที่ผ่านมาของพร็อพเพอร์ตี้ ตารางต่อไปนี้สรุปวิธีการกำหนดอัตราการสุ่มตัวอย่างช่วงเวลา

จำนวนการดูหน้าเว็บทั้งหมด (วันก่อนหน้า)	จำนวนครั้งสูงสุดของเหตุการณ์ระยะเวลาที่จะประมวลผล
0 - 1,000	100
1,000-100,000 คน	10% ของจำนวนการเปิดดูหน้าเว็บทั้งหมด
100,000 - 1,000,000	10,000
1,000,000 ขึ้นไป	1% ของจำนวนการเปิดดูหน้าเว็บทั้งหมด