How to implement gzip compression in nginx to improve website speed

Why use gzip compression?
nginx implements gzip
gzip processing
nginx configuration gzip

Why use gzip compression?

By turning on gzip compression in nginx, the size of static resources such as js and css in the web page will be greatly reduced, thus saving a lot of bandwidth, improving transmission efficiency, and giving users a fast experience.

nginx implements gzip

The principle of resource compression in nginx is to intercept requests through the default integrated ngx_http_gzip_module module, and perform gzip on the types that need to be gzipped. It is very simple to use and can be turned on directly by setting options. .

Request header and response header after gzip takes effect

Request Headers:
Accept-Encoding:gzip,deflate,sdch

Response Headers:
Content-Encoding:gzip
Cache-Control:max-age240

gzip processing

From the perspective of the HTTP protocol, the request header declares acceopt-encoding:gzip deflate sdch (refers to the compression algorithm, where sdch is a compression method promoted by Google itself)
Server->Response->Compress the content with gzip->Send to browser->Browser decodes gzip->Receive gzip compressed content

Common configuration parameters of gzip

gzip on|off Whether to enable gzip
gzip_buffers 4k buffer (how many blocks are buffered in memory for compression? How big is each block?)
gzip_comp_level [1-9] Recommended compression level 6, the higher the level, the less compression, but also the more CPU resources are wasted
gzip_disable Regular expression matching UA is what kind of URI is not gzipped
gzip_min_length 200 The minimum length to start compression. If the length is less than this, nginx will not compress it.
gzip_http_version 1.0|1.1 Start compression of http protocol version (default 1.1)
gzip_proxied sets the requester proxy server and how to cache content
gzip_types text/plain application/xml For which types of files to use compression such as txt, xml, html, css
gzip_vary off Whether to transmit gzip compression flag

nginx configuration gzip

Static page index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Demonstrating nginx gzip compression</title>
  <script src="./jquery.js" ></script>
</head>
<body>
<img src="./nginx_img.jpeg" style="width: 100px;height: 100px;" />
<h1>nginx implements gzip compression to reduce bandwidth usage and improve website speed</h1>
<h1>nginx implements gzip compression to reduce bandwidth usage and improve website speed</h1>
<h1>nginx implements gzip compression to reduce bandwidth usage and improve website speed</h1>
<h1>nginx implements gzip compression to reduce bandwidth usage and improve website speed</h1>
<h1>nginx implements gzip compression to reduce bandwidth usage and improve website speed</h1>
<h1>nginx implements gzip compression to reduce bandwidth usage and improve website speed</h1>
</body>
</html>

nginx configuration

server{
    listen 80;
    server_name localhost 192.168.0.96;
    gzip on;
    gzip_buffers 32 4k;
    gzip_comp_level 6;
    gzip_min_length 200;
    gzip_types application/javascript application/x-javascript text/javascript text/xml text/css;
    gzip_vary off;
    root /Users/lidong/Desktop/wwwroot/test;
    index index.php index.html index.htm;
    access_log /Users/lidong/wwwlogs/access.log;
    error_log /Users/lidong/wwwlogs/error.log;
    location ~ [^/]\.php(/|$) {
        fastcgi_pass 127.0.0.1:9000;
        fastcgi_index index.php;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
        include fastcgi_params;
    }
}

To use the page request before gzip:

Requests with gzip enabled:

Notice

Pictures and mp3 generally do not need to be compressed because the compression rate is relatively small
Generally compress text, css, js, xml format files
Smaller files do not need to be compressed and may be larger than the original file.
Binary files do not need to be compressed

Summarize

The above is the implementation method of gzip compression in nginx to improve website speed introduced by the editor. I hope it will be helpful to everyone. If you have any questions, please leave me a message and the editor will reply to you in time!

You may also be interested in:

Detailed explanation of how to enable Gzip compression in Nginx server configuration
Nginx enables GZIP compression web page transmission method (recommended)
How to enable Gzip compression in Nginx to significantly increase page loading speed
nginx configure gzip compressed page
Nginx server configuration analysis using gzip compression
Tutorial on configuring GZip compression when using Nginx as a reverse proxy for Node.js sites
How to enable compression and gzip compression in Nginx
Example of how to enable gzip compression in Nginx
Introduction to Gzip Compression Configuration in Nginx
Nginx uses the Gzip algorithm to compress messages

<<: Detailed installation steps for MySQL 8.0.11

>>: MySQL 8.0.12 installation and configuration method graphic tutorial (windows10)

Do you know how to use Vue to take screenshots of web pages?

How to implement gzip compression in nginx to improve website speed

Table of contents

Why use gzip compression?

nginx implements gzip

gzip processing

nginx configuration gzip

Do you know how to use Vue to take screenshots of web pages?

How to encapsulate axios in Vue project (unified management of http requests)

js+css to realize three-level navigation menu

Briefly describe the difference between MySQL and Oracle

Simple summary of tomcat performance optimization methods

Detailed explanation of the definition and function of delimiter in MySQL

Introduction to MySQL overall architecture

Use of Linux bzip2 command

mysql implements importing only a specified table from the sql file of exported data

Linux file systems explained: ext4 and beyond

Recommend

Summary of the operation records of changing MyISAM storage engine to Innodb in MySQL

Windows 10 1903 error 0xc0000135 solution [recommended]

Pure CSS to adjust Div height according to adaptive width (percentage)

Layui implements sample code for multi-condition query

Summary of the benefits of deploying MySQL delayed slaves

Summary of MySql import and export methods using mysqldump

Docker data management and network communication usage

Quickly solve the problems of incorrect format, slow import and data loss when importing data from MySQL

WeChat applet uniapp realizes the left swipe to delete effect (complete code)

Detailed explanation of EXT series file system formats in Linux

Table Tag (table) In-depth

Detailed explanation of Linux one-line command to process batch files

An analysis of div+float, a very important concept in website design

Details of Linux file descriptors, file pointers, and inodes

A few experiences in self-cultivation of artists