Cải tiến Lighthouse: tích hợp liên tục, công thức tính điểm hiệu suất mới và hơn thế nữa

Nhận thông tin chi tiết và thông tin cập nhật mới nhất về Lighthouse từ Hội nghị Nhà phát triển Chrome năm 2019.

Elizabeth Sweeny
Elizabeth Sweeny

Trong buổi trò chuyện về Speed Tooling Evolutions (Tiến triển công cụ tốc độ) tại Hội nghị nhà phát triển Chrome (CDS), Paul Ireland và tôi đã giới thiệu các sản phẩm và tính năng mới nhất của Google có thể giúp bạn xây dựng và duy trì trải nghiệm đặc biệt nhanh chóng cho tất cả người dùng. Trọng tâm của câu chuyện đó là được bổ sung cho nhóm công cụ theo dõi hiệu suất Lighthouse.

Bản phát hành alpha Lighthouse CI

Nhóm Lighthouse đã ra mắt phiên bản alpha của Lighthouse CI, sản phẩm tích hợp liên tục mới, cho phép bạn chạy Lighthouse trong mọi lượt cam kết trước khi đẩy sang phiên bản chính thức. Lighthouse CI chạy Lighthouse nhiều lần, xác nhận các ngưỡng kiểm tra tĩnh hoặc ngưỡng chỉ số, sau đó tải các báo cáo Lighthouse lên máy chủ để so sánh hình ảnh khác biệt và lịch sử điểm số cơ bản của danh mục. Cấu hình budgets.json hiện có hoạt động liền mạch cùng với cú pháp biểu đạt mới để xác nhận mọi kết quả danh mục hoặc bài kiểm tra Lighthouse.

Báo cáo Lighthouse CI.

Lighthouse CI hỗ trợ ngay Travis CI, Circle CIGitHub Actions (Hành động của GitHub), cũng như mọi dịch vụ CI dựa trên Ubuntu hoặc vùng chứa có một số cấu hình. Bạn có thể cài đặt máy chủ Lighthouse CI tại chỗ hoặc sử dụng hình ảnh Docker để thiết lập tức thì. Bạn có thể sử dụng bộ nhớ báo cáo Lighthouse tạm thời, công khai và miễn phí để bắt đầu ngay lập tức.

Sắp ra mắt: Thông tin cập nhật về điểm hiệu suất

Điểm số Hiệu suất của Lighthouse phiên bản 6 sắp thay đổi! Trong phiên bản 5 (tính đến tháng 11 năm 2019), Lighthouse có 5 chỉ số được tính trọng số và kết hợp để tạo thành Điểm hiệu suất 0-100: First Contentful Paint, Speed Index, First nằm nằm of CPM, Time to InteractiveThời gian hoạt động của CPU đầu tiên.

So sánh các công thức điểm hiệu suất của Lighthouse trong phiên bản 5 và 6.

Xem điểm hiệu suất của Lighthouse để biết thông tin chi tiết.

Trong Lighthouse phiên bản 6, các chỉ số mới, Thời gian hiển thị nội dung lớn nhất (LCP)Tổng thời gian chặn (TBT), sẽ thay thế thời gian hiển thị CPU không hoạt động đầu tiên (FCI) và Thời gian hiển thị nội dung có ý nghĩa đầu tiên (FMP). Trọng số của từng chỉ số trong số 5 chỉ số này sẽ được điều chỉnh để cân bằng tốt hơn các giai đoạn đo lường tải và tương tác.

Nhóm Lighthouse vẫn đang nỗ lực để đảm bảo rằng tất cả các đường cong tính điểm đều được tinh chỉnh, đồng thời các chỉ số đều hoàn thiện và được kiểm tra kỹ lưỡng. Họ dự định cung cấp Điểm hiệu suất Lighthouse phiên bản 6 vào tháng 1 năm 2020.

Gói ngăn xếp Lighthouse

Lighthouse có thể tự động phát hiện xem các trang web có sử dụng một khung hay hệ thống quản lý nội dung (CMS) và đưa thông báo dành riêng cho ngăn xếp vào báo cáo. Gói ngăn xếp thêm các đề xuất tuỳ chỉnh do các chuyên gia trong cộng đồng (chẳng hạn như bạn!) tuyển chọn, ngoài Lighthouse trong các hoạt động kiểm tra chính yếu.

Đề xuất về báo cáo Lighthouse để trì hoãn hình ảnh ngoài màn hình trong ứng dụng React.

Hiện tại, có các Gói ngăn xếp dành cho Angular, WordPress, Magento, React và AMP. Để tạo Gói ngăn xếp của riêng bạn, hãy truy cập vào kho lưu trữ GitHub hoặc liên hệ với nhóm Lighthouse.

Sắp ra mắt: Các trình bổ trợ Lighthouse dưới dạng Tiện ích của Chrome

Biểu tượng trình bổ trợ Lighthouse.

Trình bổ trợ Lighthouse là một cách khác để bạn có thể tận dụng khả năng mở rộng của Lighthouse. Có rất nhiều quy trình kiểm tra chất lượng mà các quy trình kiểm tra cốt lõi của Lighthouse hiện chưa đề cập đến, vì các bước này chỉ áp dụng cho một nhóm nhỏ nhà phát triển hoặc do nhóm chưa có đủ băng thông để tạo các bài kiểm tra.

Các trình bổ trợ Lighthouse cho phép các chuyên gia cộng đồng triển khai một tập hợp các bước kiểm tra mới mà Lighthouse có thể chạy và thêm vào báo cáo dưới dạng một danh mục mới. Hiện tại, các trình bổ trợ chỉ hoạt động trong Lighthouse, nhưng mục tiêu là bật các trình bổ trợ đó trong bảng điều khiển Kiểm tra của Công cụ cho nhà phát triển.

Bảng điều khiển Công cụ kiểm tra công cụ của Chrome cho nhà xuất bản có các lựa chọn để chạy trình bổ trợ Lighthouse cho Quảng cáo của nhà xuất bản của Google và Trải nghiệm người dùng.
Trình bổ trợ cộng đồng trong bảng điều khiển Kiểm tra công cụ cho nhà phát triển (bản thử nghiệm)

Khi người dùng cài đặt các tiện ích trình bổ trợ Lighthouse từ Cửa hàng Chrome trực tuyến, Công cụ cho nhà phát triển sẽ xác định các trình bổ trợ đã cài đặt và cung cấp các tiện ích đó dưới dạng một tuỳ chọn trong bảng điều khiển Kiểm tra. Nhóm Lighthouse sẽ xây dựng khả năng hỗ trợ cho phương pháp trình bổ trợ trong những tháng tới. Vì vậy, hãy chú ý theo dõi. Trong thời gian chờ đợi, bạn có thể tạo một trình bổ trợ ngay hôm nay dưới dạng mô-đun nút và giúp tất cả người dùng Lighthouse có thể truy cập vào mô-đun đó thông qua CLI!

Tìm hiểu thêm

Để biết thêm thông tin chi tiết về Lighthouse và các bản cập nhật công cụ hiệu suất khác trong CDS 2019, hãy xem bài nói chuyện về quá trình phát triển của công cụ Speed:

Ý kiến phản hồi của bạn rất có giá trị trong việc giúp Lighthouse tốt hơn. Vì vậy, hãy tiếp tục và dùng thử Lighthouse CI, viết một Stack Pack hoặc tạo một Trình bổ trợ Lighthousecho chúng tôi biết suy nghĩ của bạn.