Google Lighthouse là gì? Cách sử dụng Google Lighthouse ra sao? Đây là câu hỏi được rất nhiều người quan tâm. Trong bài viết này hãy cùng chúng tôi tìm hiểu kỹ hơn về Cách sử dụng Google Lighthouse.
Google Lighthouse là gì?
Google Lighthouse là gì?
Google Lighthouse là một công cụ open-source tự động giúp cải thiện chất lượng của website. Với công cụ google Lighthouse bạn hoàn toàn có thể sử dụng nó cho bất kỳ website nào. Từ những website công khai cho đến những website có yêu cầu xác thực. Nó sẽ có tác dụng kiểm tra về mặt hiệu suất, khả năng truy cập, các ứng dụng của web ở trên trang.
Hiện nay bạn có thể thực hiện việc chạy Google Lighthouse trong Chrome dev tool command line hoặc là ở dưới dạng Node module. Công việc của bạn chỉ là cung cấp cho Lighthouse một mã URL, sau đó nó sẽ chạy một loạt các công việc kiểm tra đối với trang web và tạo ra một báo cáo hoàn chỉnh về mức độ hoạt động của trang. Báo cáo này có đầy đủ các thông tin về chỉ số của website. Từ đó bạn có thể thực hiện việc thay đổi cũng như là sửa chữa sao cho hoàn chỉnh hơn.
Cách sử dụng Google Lighthouse
Hiện nay trên thực tế đang có ba cách để chạy Google Lighthouse đó là: Chrome DevTools, Node Command line tool, Chrome Extension. Dưới đây sẽ là hướng dẫn chi tiết cho cả 3 cách để các bạn cùng tham khảo:
Chạy Lighthouse trong Chrome DevTools
Hiện tại trong mục audits Panel của Chrome devtools đang cho phép thực hiện việc áp dụng Google Lighthouse cho website dưới đây sẽ là các bước để bạn có thể thực hiện việc nhận báo cáo phân tích:
- Bước 1: Thực hiện việc truy cập vào website mà bạn muốn kiểm tra thông qua hệ thống Google Chrome
- Bước 2: Thực hiện việc nhấn tổ hợp phím Ctrl – Shift – I để có thể mở mở developer tools. Tiếp theo đó bạn sẽ nhìn thấy Audits, hãy nhấn vào top này.
- Bước 3: Click chọn vào Perform an audit DevTools. Nó sẽ cho phép hiển thị danh sách các audit categories.
- Bước 4: Bạn hãy đánh dấu tích vào những mục mà bạn muốn Google Lighthouse phân tích. Tuy nhiên tốt nhất là bạn nên đánh dấu tất cả các mục để có thể có được bản báo cáo hoàn chỉnh.
- Bước 5: Tiếp tục chọn Run Audits và đợi để cho Google Lighthouse thực hiện việc kiểm tra kết quả. Sau khoảng độ 60 đến 90 giây bạn sẽ thấy kết quả được hiển thị.
Các cách sử dụng Google Lighthouse
Cài đặt và chạy Lighthouse trong Node Command line tool
- Bước 1: Bạn có thể bỏ qua bước này nếu như đã có Google Chrome. Trong trường hợp máy tính chưa có Google Chrome thì hãy thực hiện được cài đặt Google Chrome.
- Bước 2: Tiếp theo thực hiện việc cài đặt phiên bản Long-Term Support mới nhất của Node.
- Bước 3: Thực hiện các lệnh sau:
- npm install -g lighthouse.
- lighthouse
- lighthouse –help
Chạy Lighthouse bằng Chrome Extension
Thêm một cách để chạy Lighthouse nữa đó là bạn có thể cài đặt Chrome extension. Sau đây là các bước thực hiện:
- Bước 1: Hãy vào Google Chrome và tìm kiếm Lighthouse Chrome Extension. Tiếp theo đó bạn hãy mở trang web ra và thêm Lighthouse vào tiện ích của Google Chrome.
- Bước 2: Hãy truy cập vào trang web mà bạn muốn tiến hành việc kiểm tra.
- Bước 3: Sau khi đã truy cập vào trang web thì các bạn hãy Click vào ký hiệu Extension Lighthouse ở ngay góc trên bên phải của Chrome. Như vậy là bạn đã kích hoạt tính năng extension.
- Bước 4: Tiếp theo hãy click vào Generate report để tiến hành việc kiểm tra cũng như là đưa ra kết quả báo cáo cho website.
Nhìn chung việc sử dụng Google Lighthouse trên chrome devtools vẫn là một trong những phương pháp hiệu quả và nhanh chóng nhất. Điều này là bởi vì nó cung cấp những tính năng tương tự giống như là chrome extension. Tuy nhiên nó không yêu cầu bạn phải thực hiện việc cài đặt.
Phân tích Website bằng Google Lighthouse
Các chuẩn Audit của Google Lighthouse
Google Lighthouse – Performance
Performance (hiệu suất website) phụ thuộc vào nhiều yếu tố, cả back-end lẫn front-end. Để được Lighthouse đánh giá cao, bạn cần: Optimize images, minify Css/Js, tăng tốc website bằng lazy loading,…
Tuy nhiên tăng trải nghiệm người dùng vẫn là quan trọng nhất. Nếu phải hy sinh các yếu tố nâng cao trải nghiệm (ví dụ: chất lượng hình ảnh) để đạt số điểm performance cao thì không cần thiết. 75 điểm là mức chấp nhận được ở mục hiệu suất này.
Google Lighthouse – Progressive Web App
Việc Google thêm tính năng này vào Lighthouse là một dự báo sớm nhằm biến Progressive Web App trở thành tiêu chuẩn bắt buộc trong tương lai. Tuy nhiên hiện tại, bạn chưa có đủ nguồn lực và thời gian thì chưa cần chú trọng phát triển mục này. Nhưng có vài mục bắt buộc phải thực hiện như:
- Trả về nội dung đầy đủ khi gặp lỗi Javascript
- Sử dụng HTTPS
- Chuyển hướng traffic HTTP qua HTTPS
- Nội dung nằm gói gọn trong tầm nhìn
- Có thẻ cho phép thay đổi Width và Scale
Google Lighthouse – Accessibility
Tính năng này sẽ cho biết trang web đã được tối ưu khả năng truy cập chưa. Có thể website đang tồn tại một số điểm cần cải thiện như: text quá nhỏ, độ tương phản của những đối tượng ở mức thấp,… Bạn cần đạt 100 điểm ở mục này.
Google Lighthouse – Best Practices
Best Practices yêu cầu một vài tiêu chuẩn bắt buộc của website. Điểm tuyệt đối 100 là mục tiêu phấn đấu bạn cần đạt được ở mục này.
Google Lighthouse – Đánh giá SEO
Mục này yêu cầu phải thực hiện đầy đủ các yếu tố để tối ưu khả năng SEO cho website như: sử dụng meta description, đặt từ khóa vào tiêu đề bài viết, đơn giản code, sử dụng external link và internal link,…
Tìm hiểu một số tính năng mới nhất của Google Lighthouse 3.0?
Hiện tại Lighthouse 3.0 chính là một trong những phiên bản mới nhất của Google. Phiên bản này mang đến những hiệu quả vô cùng tốt trong việc kiểm tra và phân tích nhanh chóng. Đồng thời sai số của phiên bản này cũng ít hơn so với những phiên bản trước đó, Kèm theo đó là những tính năng mới. Hãy cùng tìm hiểu một số những tính năng đáng chú ý của phiên bản này nhé:
- Tốc độ kiểm tra nhanh hơn, kết quả cũng chính xác hơn. Đồng thời sai số biên độ nhỏ hơn rất nhiều so với những phiên bản trước
- Mang đến cho người dùng một giao diện hoàn toàn mới, thuận tiện và đơn giản hơn
- Phiên bản node của Lighthouse 3.0 mang đến khả năng tương thích với các cấu hình giống như phiên bản CLI
- Kết quả báo cáo sau khi đã được phân tích sau có thể xuất ra file CSV
- Có thêm nhiều this mới: First Contentful Paint, robots.txt is not valid…
Nhìn chung Lighthouse chính là một trong những công cụ cực kỳ quan trọng giúp quá trình xây dựng và thiết kế website được hoàn chỉnh. Chính vì thế để mang đến hiệu quả tốt hơn các bạn cần hiểu rõ cách sử dụng công cụ này. Hi vọng những thông tin này đã giúp các bạn nắm rõ về Google Lighthouse là gì và cách hoạt động của nó ra sao.
Hotline công ty Tùng Phát
Dịch vụ SEO website – Tối ưu website – Audit website – Đánh giá website
Xem thêm các bài viết liên quan: