Core Web Vitals และประสิทธิภาพเว็บที่ Traveloka

ปัญหา

นี่คือประสบการณ์บนเว็บที่มีทราฟฟิกสูงและสำคัญต่อคอนเวอร์ชัน ประสิทธิภาพจึงต้องวัดจากสิ่งที่ผู้ใช้เจอจริง ไม่ใช่จากโน้ตบุ๊กของนักพัฒนา

แนวทาง

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

การแบ่งปัน

บทเรียนเหล่านี้ถูกนำไปบรรยาย ได้แก่ "Performance: Core Web Vitals Top Recommendations + INP" ที่ DevFest Jakarta 2023 และ "Bridging the Gap: Making It Easier to Build for the Web" ที่ Google I/O Extended Jakarta 2022

มีบทความด้วยเช่นกัน event loop ไม่ได้เป็นอย่างที่คุณคิด อธิบายงานยาว ๆ ที่ทำให้ INP แย่ และวิธีแบ่งมันให้เล็กลง