Nhóm web tại Zalando nhận thấy rằng việc tích hợp Lighthouse CI đã kích hoạt một phương pháp chủ động để cải thiện hiệu suất, với các quy trình kiểm tra trạng thái tự động có thể so sánh cam kết hiện tại với nhánh chính để ngăn chặn sự hồi quy hiệu suất.
Với hơn 35 triệu khách hàng đang hoạt động, Zalando là nền tảng thời trang trực tuyến hàng đầu ở Châu Âu. Trong bài đăng này, chúng tôi sẽ giải thích lý do chúng tôi bắt đầu sử dụng Lighthouse CI, tính dễ triển khai và các ưu điểm dành cho nhóm của chúng tôi.
Tại Zalando, chúng tôi hiểu mối quan hệ giữa hiệu suất của trang web và doanh thu. Trước đây, chúng tôi đã thử nghiệm mức độ ảnh hưởng của việc tăng thời gian tải một cách giả tạo trên các trang Danh mục đối với tỷ lệ thoát, tỷ lệ chuyển đổi và doanh thu trên mỗi người dùng. Kết quả rất rõ ràng. Việc cải thiện thời gian tải trang 100 mili giây giúp tăng mức độ tương tác với tỷ lệ thoát thấp hơn và tăng 0,7% doanh thu mỗi phiên.
100mili giây
Cải thiện thời gian tải trang
0,7%
Tăng doanh thu mỗi phiên
Sự ủng hộ của công ty không phải lúc nào cũng tạo nên hiệu suất
Mặc dù công ty có được hiệu suất rất lớn, nhưng nếu tiêu chí phân phối sản phẩm không phải là hiệu suất, thì hiệu suất có thể dễ dàng biến mất. Khi thiết kế lại trang web của Zalando vào năm 2020, chúng tôi tập trung cung cấp các tính năng mới trong khi vẫn duy trì trải nghiệm tuyệt vời cho người dùng, đồng thời đổi mới trang web với phông chữ tuỳ chỉnh và màu sắc rực rỡ hơn. Tuy nhiên, khi trang web và ứng dụng được thiết kế lại đã sẵn sàng phát hành, các chỉ số về người sử dụng sớm cho thấy phiên bản mới chậm hơn. Thời gian hiển thị nội dung đầu tiên chậm hơn tới 53% và Thời gian tương tác được đo lường của chúng tôi báo cáo chậm hơn tới 59%.
Trang web tại Zalando
Trang web của Zalando do một nhóm nòng cốt đang phát triển một khung tạo ra, với hơn 15 nhóm tính năng đóng góp vào các dịch vụ giao diện người dùng vi mô. Trong khi hỗ trợ bản phát hành mới, chúng tôi cũng chuyển đổi một phần trang web của mình sang một kiến trúc tập trung hơn.
Cấu trúc trước đây có tên là Khảm đã bao gồm một cách đo lường hiệu suất trang bằng các chỉ số nội bộ. Tuy nhiên, rất khó để so sánh các chỉ số hiệu suất trước khi triển khai cho người dùng thực tế vì chúng tôi thiếu các công cụ theo dõi hiệu suất nội bộ của phòng thí nghiệm. Mặc dù việc triển khai hằng ngày, nhưng các nhà phát triển vẫn nhận được vòng phản hồi khoảng một ngày để tìm cách cải thiện hiệu suất.
Các chỉ số quan trọng về trang web và Lighthouse
Chúng tôi không hài lòng hoàn toàn với các chỉ số nội bộ vì các chỉ số này chưa thích ứng tốt với chế độ thiết lập mới. Quan trọng hơn, họ không tập trung vào trải nghiệm khách hàng. Chúng tôi chuyển sang sử dụng Các chỉ số quan trọng về trang web vì những chỉ số này cung cấp một bộ chỉ số cô đọng, toàn diện và tập trung vào người dùng.
Để cải thiện hiệu suất trước khi phát hành, chúng tôi cần tạo một môi trường phòng thí nghiệm thích hợp. Điều này còn cung cấp các phép đo có thể tái tạo, ngoài các điều kiện thử nghiệm đại diện cho phân vị thứ 90 của dữ liệu trường. Giờ đây, các kỹ sư phụ trách việc cải thiện hiệu suất đã biết nên tập trung nỗ lực vào đâu để tạo nên tác động lớn nhất. Chúng tôi đã sử dụng cục bộ các báo cáo kiểm tra Lighthouse. Vì vậy, lần lặp đầu tiên của chúng tôi là phát triển một dịch vụ dựa trên mô-đun nút Lighthouse, trong đó có thể thử nghiệm các thay đổi từ môi trường thử nghiệm. Việc này mang lại cho chúng tôi một vòng hồi tiếp đáng tin cậy về hiệu suất khoảng một giờ, nhờ đó giúp chúng tôi đạt được hiệu suất tương đương và lưu bản phát hành của mình!
Cung cấp ý kiến phản hồi về hiệu suất cho nhà phát triển về yêu cầu lấy dữ liệu
Chúng tôi không muốn dừng lại ở đó, vì chúng tôi muốn nhân cơ hội này để không chỉ phản ứng theo hiệu suất mà còn phải chủ động. Việc chuyển từ mô-đun nút Lighthouse sang máy chủ Lighthouse CI (LHCI) không quá khó. Chúng tôi đã chọn giải pháp tự lưu trữ để có thể tích hợp tốt hơn với các dịch vụ của công ty hiện tại. Ứng dụng máy chủ LHCI của chúng tôi được xây dựng dưới dạng hình ảnh Docker, sau đó được triển khai cho cụm Kubernetes cùng với cơ sở dữ liệu PostgreSQL, rồi báo cáo cho GitHub.
Khung của chúng tôi đã cung cấp một số ý kiến phản hồi về hiệu suất cho các nhà phát triển – kích thước gói thành phần đang được so sánh với các giá trị ngưỡng trong mỗi lượt cam kết. Hiện tại, chúng ta có thể báo cáo các chỉ số Lighthouse dưới dạng kiểm tra trạng thái GitHub. Điều này khiến quy trình CI không hoạt động nếu không đáp ứng ngưỡng hiệu suất, kèm theo đường liên kết đến các báo cáo Lighthouse chi tiết như trong các hình sau.
Mở rộng phạm vi hiệu suất
Chúng tôi bắt đầu với một cách tiếp cận rất thực tế. Hiện tại, Lighthouse chỉ chạy trên hai trong số các trang quan trọng nhất của chúng tôi: trang chủ và trang chi tiết sản phẩm. Rất may là Lighthouse CI giúp bạn dễ dàng mở rộng cấu hình chạy. Những nhóm phụ trách tính năng đang làm việc trên các trang cụ thể trong trang web của chúng tôi có thể thiết lập mẫu URL và câu nhận định phù hợp. Với phương án này, chúng tôi khá tự tin rằng phạm vi hiệu suất của chúng tôi sẽ tăng lên.
Giờ đây, chúng tôi tự tin hơn nhiều khi xây dựng các bản phát hành lớn hơn và nhà phát triển có thể tận hưởng vòng lặp phản hồi ngắn hơn nhiều về hiệu suất của mã.