Lighthouse là gì

     

Lighthouse là một công vậy audits web mới của Google. Vậy mức sử dụng hữu ích này có gì mới, mang lại lợi ích gì cho website của bạn?Bizfly Cloudchia sẻ về Google lighthouse audit trong nội dung bài viết sau đây.

Bạn đang xem: Lighthouse là gì

Lighthouse là gì?

Lighthouse là một trong những công vắt open-source auto nhằm cải thiện chất lượng của những trang web. Chúng ta có thể áp dụng nó cho bất kỳ trang website nào, từ website công khai minh bạch đến trang web yêu mong xác thực. Công cụ audit google chrome này sẽ soát sổ về hiệu suất, tài năng truy cập, những ứng dụng web… bên trên trang.

Bạn rất có thể chạy Lighthouse trong Chrome DevTools, trường đoản cú command line hoặc bên dưới dạng Node module. Bạn hỗ trợ cho Lighthouse một URL, tiếp nối Lighthouse chạy một loạt những kiểm tra đối với trang, sau cùng nó sẽ khởi tạo ra một report về mức độ hoạt động của trang. Từ bỏ đó, bạn hãy sử dụng kết quả của bài xích kiểm tra, nâng cao các chỉ số chưa đạt để cải thiện trang.

Xem video dưới trên đây để bài viết liên quan về cách sử dụng của Lighthouse vào sự kiện Google I/O 2017:https://youtu.be/NoRYn6gOtVo

bước đầu sử dụng Google Lighthouse

Chọn cách chạy Lighthouse tương xứng nhất với bạn:

- trong Chrome DevTools. Thuận tiện kiểm tra những trang yêu thương cầu chuẩn xác và đọc báo cáo trong định dạng gần gũi với bạn dùng.

- tự command line. Auto chạy Lighthouse qua những shell scripts.

- Node module. Tích thích hợp Lighthouse vào hệ thống tích thích hợp liên tục của chúng ta (continuous integration systems).

Lưu ý: hầu hết Lighthouse workflow yêu cầu bạn phải setup Google Chrome trên sản phẩm công nghệ của mình.

1. Chạy Lighthouse trong Chrome DevTools

Lighthouse hiện tại đang cấp quyền đến Audits panel của Chrome DevTools. Để chạy report bạn dìm F12 hoặc Ctrl Shift I kế tiếp chọn tab Audits:

- Click Perform an audit. DevTools hiển thị danh sách các audit categories. Lựa chọn kích hoạt tất cả.

- Click Run audit. Sau 60s cho 90s, Lighthouse đã hiển thị report cho trang.



Cài đặt cùng chạy Node command line tool

Các bước thiết đặt Node module

- tải về Google Chrome for Desktop.

- setup phiên bản Long-Term support hiện trên của Node.

- thiết đặt Lighthouse. -g flag tức là global module.

npm install -g lighthouse

-Tiến hành một audit:

lighthouse

- Hiển thị tùy chọn audit:

lighthouse --help

2. Chạy Lighthouse bởi Chrome Extension

Lưu ý: Trừ khi bạn có lý do cụ thể, nếu không bạn nên sử dụngLighthouse bên trên Chrome DevTools thay vị Chrome Extension này. Thao tác làm việc trên DevTools cung cấp các tính năng giống hệt như Extension, dường như có điểm buổi tối ưu hơn sẽ là không buộc phải cài đặt.

Để thiết đặt extension:

- tải về Google Chrome for Desktop.

Xem thêm: Từ Nay Xa Cách Không Còn Ta Trông Thấy Nhau, Lương Sơn Bá Chúc Anh Đài

- tải đặtLighthouse Chrome Extensiontừ the Chrome Webstore.

Để chạy audit:

- trong Chrome, tiếp cận trang bạn muốn tiến hành audit.

- Click Lighthouse nằm ở bên cạnh Chrome address bar. Nếu như không thấy, hãy mở menu thiết yếu của Chrome và truy vấn vào phần đầu tiên của menu. Sau click, Lighthouse menu đã mở rộng.


*



Chia sẻ report bằng JSON

Lighthouse Viewer đề nghị JSON output đầu ra của báo cáo Lighthouse. Danh sách sau đây hướng dẫn giải pháp lấy JSON output, tùy thuộc vào Lighthouse workflow mà nhiều người đang sử dụng:

- Chrome DevTools. Click download Report.

- Command line. Chạy lệnh sau:

lighthouse --output json --output-path

- Chrome Extension. Click Export > Save as JSON.

Để xem tài liệu báo cáo:

- Mở Lighthouse Viewer vào Google Chrome.

- Kéo tệp JSON vào Viewer hoặc nhấp vào ngẫu nhiên đâu bên trên Viewer để navigator tệp và lựa chọn tệp.

Chia sẻ report như GitHub Gists

Nếu bạn không muốn tự xem những tệp JSON, chúng ta có thể chia sẻ report của mình dưới dạng GitHub Gists túng thiếu mật. Một tác dụng của Gists là free version control.

Để xuất report dưới dạng Gist từ bỏ Chrome Extension version của Lighthouse Chrome:

- Click Export > Open In Viewer. Báo cáo mở ra vào Viewer, tại vị trí https://googlechrome.github.io/lighthouse/viewer/.


- trong Viewer, click Share. Với lần thứ nhất thực hiện thao tác làm việc này, cửa sổ bật lên yêu cầu quyền truy cập dữ liệu GitHub cơ bạn dạng để đọc với ghi vào Gists của bạn.

Để xuất report dưới dạng Gist từ bỏ phiên bản CLI của Lighthouse, chỉ cần tạo Gist theo cách thủ công và sao chép-dán JSON output đầu ra của report vào Gist. Thương hiệu tệp Gist cất JSON đầu ra phải xong bằng .lighthouse.report.json.

Để xem báo cáo được lưu bên dưới dạng Gist:

- Thêm ?gist= vào URL của Viewer, nơi là ID của Gist.

Xem thêm: Hướng Dẫn Cách Rút Tiền Thẻ Mb Bank An Toàn Nhất, Hướng Dẫn Cách Rút Tiền Atm Mb Bank An Toàn Nhất

https://googlechrome.github.io/lighthouse/viewer/?gist=

- MởViewer, và dán URL của Gist vào đó.

các tiêu chuẩn chỉnh audits của Lighthouse

- Performance

- Progressive web App

- Accessibility

- Best Practices

- SEO

Tham khảo: developers.google.com/web/tools/lighthouse/