Bigger, Faster, and More Engaging while on a Budget

Zillow · 2015 · 2. Tăng trưởng · Độ khó: Dễ — bài gốc

Bối cảnh

Công cụ hiệu năng web của Zillow năm 2015: RUM tự làm đưa vào Splunk, một WebPageTest nội bộ chạy hằng ngày trên môi trường test, và thêm SpeedCurve.
Trung bình trang web cả ngành nặng lên gấp 3 trong 5 năm (700 KB → hơn 2.100 KB, theo HTTPArchive), và độ chậm dần khó thấy nếu không ai theo dõi xu hướng.

Đặt performance budget cho mọi trang chính trên SpeedCurve, cả kích thước tài nguyên (JS, ảnh, font, số request) lẫn mốc thời gian; báo khi lệch quá 5% hoặc vượt budget.
Lần báo đáng nhớ: trang tìm kiếm mobile sau một bản phát hành có thời gian tải 11 s → gần 18 s, tổng trang 13,2 MB (vượt 417%), ảnh tăng từ 1 MB lên 12,3 MB. RUM xác nhận chậm hơn khoảng 7–10 s ở p75/p90.
Điều tra: tính năng mới (ảnh listing to hơn) đã thắng A/B test; thủ phạm thật là lỗi trong bucket control của một A/B test khác chuẩn bị ra, tải ngầm ảnh cho một tính năng chưa bật.
Engagement gần như không đổi và SpeedIndex không đổi: ảnh thừa tải sau phần trên màn hình nên người dùng không cảm thấy. Vẫn hotfix vì tốn data và pin.

Budget bắt được thay đổi trọng lượng ngay hôm sau bản phát hành, điều mà A/B test (đo engagement) bỏ qua (Observability và monitoring, Kiến trúc frontend).
Theo Zillow, onload không phải mục tiêu tốt cho hiệu năng cảm nhận; nên đặt mốc User Timing cho phần trên màn hình.

Đặt budget cho trang thay đổi thường xuyên, và đọc cảnh báo ngay sau mỗi bản phát hành.
Code cho tính năng chưa bật (dark code trong bucket A/B) vẫn chạy và vẫn tốn tài nguyên.
Một chỉ số xấu đi không chắc người dùng cảm thấy; cần chỉ số đo đúng thứ người dùng thấy.