Bật tùy chọn nén văn bản

Bạn phải phân phát các tài nguyên dựa trên văn bản dưới dạng nén để giảm thiểu tổng số byte mạng. Mục Cơ hội của báo cáo Lighthouse liệt kê tất cả tài nguyên dựa trên văn bản không được nén:

Ảnh chụp màn hình tính năng Lighthouse Cho phép kiểm tra nén văn bản

Cách Lighthouse xử lý quá trình nén văn bản

Lighthouse thu thập tất cả phản hồi mà:

  • Có các loại tài nguyên dựa trên văn bản.
  • Đừng đặt tiêu đề content-encoding thành br, gzip hoặc deflate.

Sau đó, Lighthouse nén từng dữ liệu này bằng GZIP để tính toán các khoản tiền có thể tiết kiệm được.

Nếu kích thước ban đầu của phản hồi nhỏ hơn 1, 4 KiB hoặc nếu mức nén tiềm năng tiết kiệm được ít hơn 10% kích thước ban đầu, thì Lighthouse sẽ không gắn cờ phản hồi đó trong kết quả.

Cách bật tính năng nén văn bản trên máy chủ của bạn

Hãy bật tính năng nén văn bản trên(các) máy chủ đã phân phát các phản hồi này để vượt qua quá trình kiểm tra này.

Khi yêu cầu một tài nguyên, trình duyệt sẽ sử dụng tiêu đề của yêu cầu HTTP Accept-Encoding để cho biết những thuật toán nén mà trình duyệt hỗ trợ.

Accept-Encoding: gzip, compress, br

Nếu trình duyệt hỗ trợ Brotli(br) bạn nên sử dụng Brotli vì nó có thể giảm kích thước tệp của tài nguyên nhiều hơn so với các thuật toán nén khác. Tìm how to enable Brotli compression in <X>, trong đó <X> là tên máy chủ của bạn. Kể từ tháng 12 năm 2022, Brotli được hỗ trợ trong tất cả trình duyệt chính, ngoại trừ Safari trên iOS. Hãy xem bài viết Khả năng tương thích với trình duyệt để biết thông tin cập nhật.

Sử dụng GZIP làm phương án dự phòng cho Brotli. GZIP được hỗ trợ trong tất cả các trình duyệt chính, nhưng kém hiệu quả hơn Brotli. Hãy đọc bài viết Cấu hình máy chủ để biết ví dụ.

Máy chủ của bạn sẽ trả về tiêu đề phản hồi HTTP Content-Encoding để cho biết thuật toán nén mà máy chủ sử dụng.

Content-Encoding: br

Kiểm tra xem một phản hồi có được nén trong Công cụ của Chrome cho nhà phát triển hay không

Cách kiểm tra xem máy chủ có nén một phản hồi hay không:

Nhấn Control+Shift+J (hoặc Command+Option+J trên máy Mac) để mở Công cụ cho nhà phát triển. Nhấp vào thẻ Mạng.

[nhận xét]: <> (Danh sách sau đây là một đoạn mã ngắn từ web.dev, nhưng không được dịch từ tiếng Anh cho bất kỳ ngôn ngữ nào.) 1. Nhấn Control+Shift+J (hoặc Command+Option+J trên máy Mac) để mở Công cụ cho nhà phát triển. 2. Nhấp vào thẻ Mạng. 3. Nhấp vào yêu cầu dẫn đến câu trả lời mà bạn quan tâm. 4. Nhấp vào thẻ Tiêu đề. 5. Kiểm tra tiêu đề content-encoding trong phần Tiêu đề phản hồi.

Tiêu đề phản hồi mã hoá nội dung
Tiêu đề phản hồi content-encoding.

Cách so sánh kích thước nén và giải nén của một phản hồi:

[nhận xét]: <> (Danh sách sau đây là một đoạn mã ngắn từ web.dev, nhưng không được dịch từ tiếng Anh cho bất kỳ ngôn ngữ nào.) 1. Nhấn Control+Shift+J (hoặc Command+Option+J trên máy Mac) để mở Công cụ cho nhà phát triển. 2. Nhấp vào thẻ Mạng. 3. Bật các hàng yêu cầu lớn. Xem phần Sử dụng các hàng yêu cầu lớn. 4. Xem cột Kích thước cho câu trả lời mà bạn quan tâm. Giá trị cao nhất là kích thước nén. Giá trị dưới cùng là kích thước đã giải nén.

Xem thêm về Giảm thiểu và nén tải trọng mạng.

Hướng dẫn dành riêng cho ngăn xếp

Joomla

Bật chế độ cài đặt Nén trang Gzip (Hệ thống > Cấu hình chung > Máy chủ).

WordPress

Bật tính năng nén văn bản trong cấu hình máy chủ web.

Tài nguyên