Hướng dẫn từ A-Z cách bật nén gzip để tăng tốc độ website

Hướng dẫn từ A-Z cách bật nén gzip để tăng tốc độ website

Sunday January 22nd, 2023 Blog, Tin tức

Với những người quản lý dữ liệu, tối ưu trang web luôn muốn trang bị những phương pháp hữu hiệu nhất để xử lý vấn đề hay gặp phải. Dạo gần đây, một phương pháp được cho là hiệu quả, dễ sử dụng được nhiều người biết đến. Đó là gzip, một bài giải hay được mọi người truyền tai nhau. Nhưng còn nhiều người chưa biết đến chúng, khái niệm, cách sử dụng,.. Cùng chúng tôi tìm hiểu qua bài viết này nhé.

Gzip là gì?

Đây là một phương thức nén, làm giảm dung lượng dữ liệu trên Server khi gửi đến Client. Qua đó, bạn sẽ thấy băng thông tiết kiệm đáng kể cùng với đó là cải thiện tốc độ tải website.

Công cụ hoạt động tương tự như khi sử dụng WinRAR để nén file trên máy tính. Thông qua cơ chế xử lý, dữ liệu truyền đến Client sẽ tự động giảm dung lượng. Thông tin hiển thị cho người truy cập đảm bảo ở điều kiện bình thường.

Công cụ có khả năng hỗ trợ toàn diện hơn so với những loại khác. Bởi lẽ, các file tĩnh như HTML, CSS, Javascript hoặc các document XML, JSON đều xử lý được.

Hướng dẫn từ A-Z cách bật nén gzip để tăng tốc độ website 2

Ưu/ nhược điểm gzip

Ưu điểm

Được mọi người nhận xét nên sử dụng bởi tính tương thích của nó với các trình duyệt khá cao. Dù là Google Chrome, Firefox hay Cốc Cốc,… đều được hỗ trợ nén khá tốt.

Nhiều nghiên cứu cho rằng công cụ giảm dung lượng trang từ 50 – 80%. Điều đó đồng nghĩa với việc tốc độ tải nhanh, tiết kiệm băng thông. Tiết kiệm được khá nhiều thời gian khi sử dụng chúng đúng không nào.

Nhược điểm

Dù độ tương thích cao là vậy, nhưng nếu người dùng sử dụng trình duyệt quá cũ sẽ không được mượt mà, thuận lợi. Cụ thể như Internet Explorer < 6 khiến quá trình giải nén lâu hơn.- Công cụ chỉ hiệu quả tuyệt đối với file text như HTML, Javascript, CSS, XML…Trái lại, gzip chưa thực sự tối ưu hết với file media, file ảnh, video, audio, PDF… Nén gzip chiếm một phần nhất định CPU của server.Để tránh trường hợp giải nén lâu, bạn nên sử dụng hay cập nhật trình duyệt mới nhé.

Bật nén Gzip WordPress

Trước hết, hãy kiểm tra xem web server bạn đang sử dụng đang thuộc loại nào: Apache, LiteSpeed hay NginX. Nếu bạn không chắc chắn, bạn có thể hỏi nhà cung cấp dịch vụ. cách bật nén dưới đây không chỉ áp dụng đối với website WordPress mà còn có thể áp dụng cho tất cả các mã nguồn website khác.

Gzip compression bằng mod_deflate cũng khá ok, có thể được kích hoạt bằng cách thêm dòng code sau vào file .htaccess của bạn:

Trước khi bắt đầu bạn cần chuẩn bị như sau:

  • Truy cập vào file .htaccess
  • Truy cập cPanel (optional)

Kích hoạt nén bằng gzip

Bạn có thể kích hoạt gzip trên website của bạn bằng cách dùng mod_gzip hoặc mod_deflate. Nén bằng mod_deflate bạn cũng có thể dùng vì thuật toán chuyển đổi tốt hơn và module của nó tương thích cao hơn với phiên bản mới của apache.

Hướng dẫn từ A-Z cách bật nén gzip để tăng tốc độ website 4

Tiếp đến ta sẽ gắn mã:

(Lưu ý: với hướng dẫn này bạn cũng có thể làm trên các mã nguồn khác vì nó can thiệp vào file .htaccess mà thôi)

Các bạn chỉ việc sao chép (copy) và dán (paste) vào file .htaccess. Bạn cần vào thư mục root của website sau đó mở file .htaccess bằng notepad++ hoặc công cụ soạn thảo bất kỳ sau đó thì copy đoạn sau đây:

<IfModule mod_deflate.c>

############################################

## enable apache served files compression

# Insert filter on all content

SetOutputFilter DEFLATE

# Insert filter on selected content types only

AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css text/javascript

# Netscape 4.x has some problems...

BrowserMatch ^Mozilla/4 gzip-only-text/html

# Netscape 4.06-4.08 have some more problems

BrowserMatch ^Mozilla/4.0[678] no-gzip

# MSIE masquerades as Netscape, but it is fine

BrowserMatch bMSIE !no-gzip !gzip-only-text/html

# Don't compress images

SetEnvIfNoCase Request_URI .(?:gif|jpe?g|png)$ no-gzip dont-vary

# Make sure proxies don't deliver the wrong content

Header append Vary User-Agent env=!dont-vary

</IfModule>

Sau đó dán vào file .htaccess và lưu lại.

Khi đã dán xong bạn up ngược trở lại hosting. Sau khi thực hiện xong bạn truy cập trang Google Speed để kiểm tra thông báo kết quả trả về đã bật nén gzip.

Bật nén Gzip với file .htaccess

Tất cả các trình duyệt hiện đại đều hỗ trợ và tự động đàm phán gzip nén cho tất cả các yêu cầu HTTP. Công việc của chúng ta là đảm bảo rằng các máy chủ được cấu hình đúng cách để phục vụ các tài nguyên nén khi có yêu cầu của máy khách (client).

Trên server Apache chúng ta có thể làm điều đó thông qua file .htaccess

# BEGIN GZIP

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

# END GZIP

Đó là bản chất là một danh sách các kiểu MIME mà gzipping sau đó sẽ được áp dụng. Hãy thay đổi danh sách cho tất cả các tài sản dựa trên văn bản bạn phục vụ.

Các dự án HTML5 Boilerplate cung cấp các cấu hình máy chủ cho tất cả các máy chủ phổ biến. Điều này là nó là phiên bản dành cho .htaccess

<IfModule mod_filter.c>

    AddOutputFilterByType DEFLATE "application/atom+xml" \

                                  "application/javascript" \

                                  "application/json" \

                                  "application/ld+json" \

                                  "application/manifest+json" \

                                  "application/rdf+xml" \

                                  "application/rss+xml" \

                                  "application/schema+json" \

                                  "application/vnd.geo+json" \

                                  "application/vnd.ms-fontobject" \

                                  "application/x-font-ttf" \

                                  "application/x-javascript" \

                                  "application/x-web-app-manifest+json" \

                                  "application/xhtml+xml" \

                                  "application/xml" \

                                  "font/eot" \

                                  "font/opentype" \

                                  "image/bmp" \

                                  "image/svg+xml" \

                                  "image/vnd.microsoft.icon" \

                                  "image/x-icon" \

                                  "text/cache-manifest" \

                                  "text/css" \

                                  "text/html" \

                                  "text/javascript" \

                                  "text/plain" \

                                  "text/vcard" \

                                  "text/vnd.rim.location.xloc" \

                                  "text/vtt" \

                                  "text/x-component" \

                                  "text/x-cross-domain-policy" \

                                  "text/xml"

</IfModule>

Bật nén qua hosting cPanel

Nếu có license cPanel, bạn có thể bật nén gzip cho tất cả các website của mình thông qua mục Optimize Website (thường nằm ở phần Softwares). Sau khi mở mục này ra, hãy chọn Compression all content, sau đó click vào nút “Update Settings”. Thao tác bạn vừa làm thực chất là để khai báo các dòng code vào file cấu hình .htaccess, từ đó kích hoạt gzip cho các website trên hosting. Đọc qua thì thấy đơn giản đúng không nào.

Bài viết vừa rồi là những thông tin về gzip, hy vọng qua bài viết bạn sẽ có cái nhìn mở rộng hơn về gzip, đúc kết ra được những kinh nghiệm tốt. Chúc bạn thành công.

Hosting tốc độ cao - Chất lượng tốt [ Tặng miễn phí trọn bộ plugin SEO trị giá 359$ ]

+ Giá không thể tốt hơn: Chỉ từ 45K/tháng kèm nhiều ưu đãi chỉ có tại TENTEN.

+ Tặng miễn phí bộ plugin SEO hỗ trợ website ONTOP Goole:

    • Rank Math Pro - tối ưu SEO
    • WP rocket - Tăng tốc độ tải trang
    • Imagify - Nén dung lượng ảnh

+ Bảo mật 99,99%

+ Backup dữ liệu thường xuyên

+ Hỗ trợ kỹ thuật 24/7

LỰA CHỌN HOSTING PHÙ HỢP TẠI ĐÂY

Các tìm kiếm liên quan đến chủ đề “Gzip”

GZIP compression Gzip Linux Gzip Windows GZIP online
Gzip ubuntu
Gzip format Download gzip Test gzip compression

Bài liên quan

Recommended Articles for you

  • GraphQL là gì? So sánh chi tiết GraphQL và REST

    GraphQL là gì? So sánh chi tiết GraphQL và REST

    Blog, Tin tức Saturday June 22nd, 2024
  • Install SSL nginx có khó không? Hướng dẫn thao tác chi tiết

    Install SSL nginx có khó không? Hướng dẫn thao tác chi tiết

    Blog, Tin tức Friday June 21st, 2024

Do not have missed that article?

  • GraphQL là gì? So sánh chi tiết GraphQL và REST

    GraphQL là gì? So sánh chi tiết GraphQL và REST

    Blog, Tin tức Saturday June 22nd, 2024
  • Install SSL nginx có khó không? Hướng dẫn thao tác chi tiết

    Install SSL nginx có khó không? Hướng dẫn thao tác chi tiết

    Blog, Tin tức Friday June 21st, 2024
  • Mua SSL ở đâu uy tín? Mua SSL cần dựa vào những yếu tố nào?

    Mua SSL ở đâu uy tín? Mua SSL cần dựa vào những yếu tố nào?

    Blog, Tin tức Thursday June 20th, 2024
  • Globalsign SSL là gì? Có nên mua chứng chỉ số Globalsign? 

    Globalsign SSL là gì? Có nên mua chứng chỉ số Globalsign? 

    Blog, Tin tức Wednesday June 19th, 2024