WebNền tảng
Core Web Vitals và hiệu năng web tại Traveloka
Tối ưu hiệu năng cho các trang có lưu lượng lớn và quan trọng với tỷ lệ chuyển đổi, dựa trên đo lường người dùng thật và ngân sách hiệu năng.
- Vai trò
- Software Engineer (Web)
- Thời gian
- 2018–2025
- Công nghệ
- Core Web Vitals · Next.js · Real-user monitoring · Code splitting
Vấn đề
Đây là những trải nghiệm web có lưu lượng lớn và quan trọng với tỷ lệ chuyển đổi, nên hiệu năng phải được đo từ những gì người dùng thực sự trải qua, chứ không phải từ máy tính của lập trình viên.
Cách tiếp cận
- Đo người dùng thật trước. Dữ liệu người dùng thật quyết định cần sửa gì, còn ngân sách hiệu năng ngăn các suy giảm quay lại.
- Giảm JavaScript mà trình duyệt phải chạy: tách mã, tải lười và tối ưu thư viện phụ thuộc.
- Sửa phần còn lại của đường đi: thực thi JavaScript, hiển thị, mạng, hình ảnh và script của bên thứ ba.
Chia sẻ lại
Tôi biến những bài học này thành các bài nói: "Performance: Core Web Vitals Top Recommendations + INP" tại DevFest Jakarta 2023, và "Bridging the Gap: Making It Easier to Build for the Web" tại Google I/O Extended Jakarta 2022.
Tôi cũng viết về nó: event loop không như bạn nghĩ giải thích các tác vụ dài khiến INP kém và cách chia nhỏ chúng.