เวลาในการตอบสนอง (TTI)

Time to Interactive (TTI) เป็นเมตริกในห้องทดลองสำหรับวัดการตอบสนองของภาระงาน ซึ่งจะช่วยระบุกรณีที่หน้าเว็บดูแบบอินเทอร์แอกทีฟ แต่จริงๆ แล้วไม่ใช่ TTI ที่รวดเร็วจะช่วยให้มั่นใจได้ว่าหน้าเว็บใช้งานได้

TTI คืออะไร

เมตริก TTI วัดเวลาตั้งแต่ที่หน้าเว็บเริ่มต้น การโหลดไปยังเมื่อทรัพยากรย่อยหลักโหลดขึ้นมา และมีความเสถียร ตอบสนองต่อข้อมูลจากผู้ใช้อย่างรวดเร็ว

เพื่อคำนวณ TTI ตามประสิทธิภาพ ติดตาม ของหน้าเว็บ ให้ทำตามขั้นตอนต่อไปนี้

  1. เริ่มต้นที่ First Contentful Paint (FCP)
  2. ค้นหาเวลาไปข้างหน้าในหน้าต่างเงียบๆ อย่างน้อย 5 วินาที โดยที่ หน้าต่างที่เงียบหมายถึงไม่ยาว งานและงานที่กำลังดำเนินการอยู่ไม่เกิน 2 รายการ คำขอ GET ของเครือข่าย
  3. ค้นหางานล่าสุดที่ใช้เวลานานก่อนหน้าต่างที่เงียบสงบซึ่งหยุดอยู่ที่ FCP หากไม่พบงานที่ใช้เวลานาน
  4. TTI คือเวลาสิ้นสุดของงานที่ใช้เวลานานครั้งสุดท้ายก่อนที่จะถึงหน้าต่างที่เงียบ (หรือ ค่าเดียวกับ FCP หากไม่พบงานที่ใช้เวลานาน)

แผนภาพต่อไปนี้จะช่วยให้เห็นขั้นตอนด้านบนได้

ไทม์ไลน์การโหลดหน้าเว็บที่แสดงวิธีคํานวณ TTI

ที่ผ่านมา นักพัฒนาซอฟต์แวร์ได้เพิ่มประสิทธิภาพ เพื่อการแสดงผลที่รวดเร็ว บางครั้งก็สร้างความเสียหายให้กับ TTI

เทคนิคบางอย่าง เช่น การแสดงผลฝั่งเซิร์ฟเวอร์ (SSR) สามารถนำไปสู่สถานการณ์ที่หน้าเว็บ ดูแบบอินเทอร์แอกทีฟ (กล่าวคือ ลิงก์และปุ่มต่างๆ จะมองเห็นได้บนหน้าจอ) แต่ไม่ใช่ มีการโต้ตอบจริงๆ เพราะเทรดหลักถูกบล็อกหรือ เพราะโค้ด JavaScript ที่ควบคุมองค์ประกอบเหล่านั้นไม่ได้โหลดขึ้นมา

เมื่อผู้ใช้พยายามโต้ตอบกับหน้าเว็บที่ดูโต้ตอบแต่จริงๆ แล้ว ไม่ พวกเขามักจะตอบกลับด้วยหนึ่งในสองลักษณะ:

  • ในกรณีที่ดีที่สุด พวกเขาจะไม่พอใจที่หน้าเว็บตอบสนองช้า
  • ในกรณีที่เลวร้ายที่สุด พวกเขาจะคิดว่าหน้าเว็บเสียหายและมีแนวโน้ม พวกเขาอาจสูญเสียความเชื่อมั่นหรือความเชื่อมั่นในคุณค่าของแบรนด์

ในการหลีกเลี่ยงปัญหานี้ ให้พยายามทุกวิถีทางเพื่อลดส่วนต่างให้น้อยที่สุด ระหว่าง FCP และ TTI และในกรณีที่มีความแตกต่างที่เห็นได้ชัดเจน ทำให้ชัดเจนผ่านตัวบ่งชี้ที่เป็นภาพว่าองค์ประกอบในหน้าเว็บของคุณยังไม่ แบบอินเทอร์แอกทีฟ

วิธีวัด TTI

TTI เป็นเมตริกที่วัดผลได้ดีที่สุดใน Lab วิธีที่ดีที่สุดในการวัด TTI คือการเรียกใช้ การตรวจสอบประสิทธิภาพ Lighthouse ในเว็บไซต์ ดูเอกสารประกอบของ Lighthouse เกี่ยวกับ TTI เพื่อดูรายละเอียดการใช้งาน

เครื่องมือในห้องทดลอง

คะแนน TTI ที่ดีคือเท่าใด

เพื่อให้ผู้ใช้ได้รับประสบการณ์ที่ดี เว็บไซต์ควรพยายามให้มีเวลาในการ โต้ตอบได้น้อยกว่า 5 วินาทีเมื่อทดสอบในอุปกรณ์เคลื่อนที่โดยเฉลี่ย ฮาร์ดแวร์

เพื่อดูรายละเอียดว่า TTI ของหน้าเว็บส่งผลต่อคะแนนประสิทธิภาพของ Lighthouse อย่างไร ดู วิธีที่ Lighthouse ระบุ TTI ของคุณ คุณภาพ

วิธีปรับปรุง TTI

หากต้องการดูวิธีปรับปรุง TTI สำหรับบางเว็บไซต์ คุณสามารถเรียกใช้ Lighthouse ได้ ประสิทธิภาพการทำงานและ ให้ความสำคัญกับ โอกาสที่การตรวจสอบแนะนำ

หากต้องการดูวิธีปรับปรุง TTI โดยทั่วไป (สําหรับเว็บไซต์ต่างๆ) โปรดดูแหล่งข้อมูลต่อไปนี้ คำแนะนำเกี่ยวกับประสิทธิภาพ