Kỹ thuật nén gzip để tối ưu website

Nén gzip là gì

Nén gzip là cách đơn giản và hiệu quả để tiết kiệm băng thông server và tăng tốc độ website. Theo mô hình client-server truyền thống, khi trình duyệt yêu cầu một trang web, web server sẽ xử lý và trả về trang HTML được yêu cầu. Cách làm này không có vấn đề gì ngoại trừ việc kích thước trang HTML trả về có thể lớn. Trên máy tính, bạn biết rằng có những chương trình nén file như WinZip, WinRar có thể giúp giảm kích thước của file trên ổ cứng. Trên web server, chúng ta cũng có công cụ tương tự để nén, nhưng là nén dữ liệu mà server sẽ trả về cho client, bao gồm dữ liệu HTML, JavaScript, văn bản,… Nhờ vậy, kích thước dữ liệu truyền tải giữa server và client giảm xuống, website của chúng ta sẽ nạp nhanh hơn.

Bạn lưu ý là chúng ta chỉ nén dữ liệu mà server trả về cho client, chứ không phải là nén các file trên server. Các file mã trên server vẫn như cũ. Mình minh họa như hình bên dưới:

 

Kỹ thuật nén file gzip để tối ưu hóa website
Kỹ thuật nén file gzip để tối ưu hóa website

Tức là, khi web server tìm thấy dữ liệu được yêu cầu, thay vì trả thẳng về client, thì nó sẽ nén dữ liệu đó rồi mới trả về. Vậy dữ liệu truyền tải qua mạng đã được nén, nên kích thước dĩ nhiên sẽ nhỏ hơn. Khi trình duyệt bên client nhận dữ liệu nén, nó chỉ việc giải nén rồi hiển thị cho người dùng. Bạn có thể yên tâm sử dụng kỹ thuật này vì các trình duyệt ngày nay đều hỗ trợ các file nén.

Sử dụng gzip trên Apache server

Để sử dụng kỹ thuật nén gzip, web server cần phải kích hoạt module mod_gzip hoặc mod_deflate. Các web server Apache cũ hỗ trợ mod_gzip, còn các phiên bản mới gần đây thì hỗ trợ mod_deflate. mod_deflate được xem là thay thế cho mod_gzip.

Trong file cấu hình của Apache, để bật mod_gzip, bạn tìm đến dòng sau và bỏ dấu # (nếu có) ở trước:

#LoadModule gzip_module modules/mod_gzip.so

thành:

LoadModule gzip_module modules/mod_gzip.so

Nếu bạn không tìm thấy dòng trên, có khả năng phiên bản Apache của bạn mới. Bạn cần sử dụng mod_deflate. Để bật mod_deflate, bạn tìm đến dòng:

#LoadModule deflate_module modules/mod_deflate.so

và bỏ # thành:

LoadModule deflate_module modules/mod_deflate.so

Nén với mod_gzip

Để  nén với mod_gzip, bạn thêm đoạn sau vào file cấu hình host hoặc file .htaccess của thư mục web:

<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file .(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</ifModule>

Nén với mod_deflate

Tương tự như trên, để nén bằng mod_deflate, thêm đoạn sau vào file cấu hình host hoặc file .htaccess của thư mục web:

<Directory /var/www/html/>
<IfModule mod_mime.c>
AddType application/x-javascript .js
AddType text/css .css
</IfModule>
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/css application/x-javascript text/x-component text/html text/plain text/xml application/javascript
<IfModule mod_setenvif.c>
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4.0[678] no-gzip
BrowserMatch bMSIE !no-gzip !gzip-only-text/html
</IfModule>
</IfModule>
Header append Vary User-Agent env=!dont-vary
</Directory>

Trong đoạn trên, dòng:

AddOutputFilterByType DEFLATE text/css application/x-javascript text/x-component text/html text/plain text/xml application/javascript

Chính là dòng xác định kiểu dữ liệu sẽ được nén để chuyển đến client.

Kiểm tra

Để kiểm tra xem nén gzip đã hoạt động hay chưa, bạn có thể sử dụng tool online sau: http://checkgzipcompression.com/.

Kiểm tra nén gzip

Nguồn tham khảo:

Bình luận

Bình luận Facebook

lời bình luận