Kể từ Google I/O, chúng tôi đã nỗ lực để biến Lighthouse trở thành một công cụ đồng hành tuyệt vời giúp bạn xây dựng Ứng dụng web tiến bộ chất lượng cao:
- Chào đón 50 người đóng góp mới cho dự án
- Đã phát hành 15 bản phát hành
- Thêm khoảng 20 kiểm thử kiểm tra khác (~50 tổng cộng)
Hôm nay, chúng tôi rất vui mừng được thông báo về bản phát hành 1.3 của Lighthouse. Lighthouse 1.3 bao gồm một loạt các tính năng mới, quy trình kiểm tra và bản sửa lỗi thông thường. Bạn có thể cài đặt tiện ích này từ npm (npm i -g lighthouse) hoặc tải tiện ích xuống từ Cửa hàng Chrome trực tuyến.
Vậy có gì mới?
Giao diện mới
Nếu đã sử dụng phiên bản Lighthouse cũ, có thể bạn đã nhận thấy rằng biểu trưng của Lighthouse đã thay đổi! Báo cáo HTML và Tiện ích Chrome cũng đã được làm mới hoàn toàn, với cách trình bày điểm số rõ ràng hơn và nhất quán hơn giữa các kết quả kiểm tra. Chúng tôi cũng đã thêm thông tin gỡ lỗi hữu ích khi bạn không vượt qua được kiểm thử và đưa ra các gợi ý về giải pháp được đề xuất.
Các phương pháp hay nhất mới
Cho đến nay, Lighthouse đã tập trung vào các chỉ số hiệu suất và chất lượng của PWA. Tuy nhiên, mục tiêu tổng thể của dự án là cung cấp một cuốn sách hướng dẫn cho tất cả các hoạt động phát triển web. Hướng dẫn này bao gồm hướng dẫn về các phương pháp hay nhất chung, mẹo về hiệu suất và hỗ trợ tiếp cận, cũng như trợ giúp toàn diện về cách tạo ứng dụng chất lượng.
"Cải thiện web" là một nỗ lực trong dự án Lighthouse nhằm giúp nhà phát triển cải thiện hiệu suất trên web. Nói cách khác, giúp họ hiện đại hoá và tối ưu hoá ứng dụng web. Thông thường, các nhà phát triển web sử dụng các phương pháp lỗi thời, anti-pattern hoặc gặp phải các vấn đề về hiệu suất đã biết mà không hề hay biết. Ví dụ: Mọi người đều biết rằng ảnh động dựa trên JS phải được thực hiện bằng requestAnimationFrame() thay vì setInterval(). Tuy nhiên, nếu nhà phát triển không biết về API mới hơn, thì ứng dụng web của họ sẽ bị ảnh hưởng không cần thiết.
Lighthouse 1.3 có hơn 20 đề xuất phương pháp hay nhất mới, từ các mẹo hiện đại hoá các tính năng CSS và JavaScript cho đến các đề xuất về hiệu suất như: "Giảm số lượng thành phần chặn kết xuất", "Sử dụng trình nghe sự kiện thụ động để cải thiện hiệu suất cuộn".
Chúng tôi sẽ tiếp tục bổ sung các đề xuất khác theo thời gian. Nếu bạn có đề xuất về các phương pháp hay nhất hoặc muốn giúp chúng tôi viết một bài đánh giá, hãy gửi vấn đề trên GitHub.
Trình xem báo cáo
Cuối cùng, chúng tôi rất vui mừng được công bố một trình xem web mới cho kết quả Lighthouse. Truy cập vào googlechrome.github.io/lighthouse/viewer, kéo và thả kết quả của một lần chạy Lighthouse (hoặc nhấp để tải tệp lên) và thế là xong. Báo cáo HTML Lighthouse của "Insta".
Trình xem Lighthouse cũng cho phép bạn chia sẻ báo cáo với người khác. Khi nhấp vào biểu tượng chia sẻ, bạn sẽ được đăng nhập vào GitHub. Chúng tôi lưu trữ báo cáo dưới dạng gist bí mật trong tài khoản của bạn để bạn có thể dễ dàng xoá hoặc cập nhật báo cáo đã chia sẻ sau này. Việc sử dụng GitHub để lưu trữ dữ liệu cũng đồng nghĩa với việc bạn có thể sử dụng tính năng kiểm soát phiên bản miễn phí!
Trình xem Lighthouse có thể tải lại các báo cáo hiện có bằng cách thêm ?gist=GIST_ID vào URL:
Để biết tất cả thông tin chi tiết về phiên bản mới nhất của Lighthouse, hãy xem ghi chú phát hành đầy đủ trên GitHub. Như thường lệ, hãy liên hệ với chúng tôi để báo cáo lỗi, gửi yêu cầu về tính năng hoặc trao đổi ý tưởng về những tính năng mà bạn muốn thấy tiếp theo.