Nginx static resource compression

Static resources can be compressed by configuring gzip in the Nginx configuration file. Related instructions can be configured in the http block, server block, and location block. Nginx can parse and process these instructions through the module
ngx_http_gzip_modulemodule
ngx_http_gzip_static_module.
ngx_http_gunzip_module

Gzip module configuration directives

gizpThe relevant instructions are all in ngx_http_gzip_modulethe module, which will be built into the nginx installation environment when nginx is installed

  1. gzip command

This command is used to enable or disable the gzip function. Only when this command is enabled, other gzip-related commands will be effective.
Case:

http{
   gzip on;
}
  1. gzip_types directive

This command can selectively enable the Gzip compression function according to the MIME type of the response page . The selected value can be searched from the mime.types file, or "*" can be used to represent all

grammar gzip_types mime-type …;
Defaults gzip_types text/html;
Location http、server、location

case:

http{
	gzip_types application/javascript;
}
  1. gzip_comp_level directive

This command is used to set the degree of Gzip compression, the level is from 1-9, 1 means that if the degree is the lowest, if the efficiency is the highest, 9 is just the opposite, the degree of compression is the highest, but the efficiency is the lowest and the most time-consuming.

grammar gzip_comp_level level;
Defaults gzip_comp_level 1;
Location http、server、location

case:

http{
	gzip_comp_level 6;
}
  1. gzip_vary directive

This command is used to set whether to carry the "Vary:Accept-Encoding" header field of the response header when compressed using Gzip. It mainly tells the receiver that the sent data has been compressed by Gzip, please refer to the screenshot of the case.

grammar gzip_vary on|off;
Defaults gzip_vary off;
Location http、server、location
  1. gzip_buffers directive

This instruction is used to process the number and size of buffers requested to be compressed.
number specifies the number of cache spaces that the Nginx server applies to the system, and
size refers to the size of each cache space. The main implementation is to apply for number memory spaces each of size size. The setting of this value is generally related to the operating system of the server. It is recommended not to set this item and use the default value.

grammar gzip_buffers number size;
Defaults gzip_buffers 32 4k|16 8k;
Location http、server、location
  1. gzip_disable directive

For requests initiated by different types of clients , the Gzip function can be selectively turned on and off.
regex : set according to the client's browser flag ( user-agent ), and support the use of regular expressions. The specified browser flag does not use Gzip. This directive is generally used to exclude some browsers that obviously do not support Gzip.

grammar gzip_disable regex …;
Defaults
Location http、server、location

case:

http {
  gzip_disable "MSIE [1-6]\.";
}
  1. gzip_http_version directive

For different HTTP protocol versions , the Gzip function can be selectively enabled and disabled.
This instruction is to specify the minimum version of HTTP that uses Gzip, and this instruction generally uses the default value.

grammar gzip_http_version 1.0|1.1;
Defaults gzip_http_version 1.1;
Location http、server、location
  1. gzip_min_length directive

This instruction can selectively enable and disable the Gzip function for the size of the transmitted data
. The unit of nignx measurement size: bytes[byte] / kb[kilobyte] / M[megabyte] 1024 / 10k|K / 10m|M
Gzip compression function has an obvious compression effect on large data , but some originally small files become larger after being compressed. Therefore, it is necessary to decide whether to use the Gzip function according to the size of the response content. The size of the response page can be obtained from the header information Content-Length. However, if Chunk encoding is used for dynamic compression, this instruction will be ignored. It is recommended to set it to 1K or above.

grammar gzip_min_length length;
Defaults gzip_min_length 20;
Location http、server、location
  1. gzip_proxied directive

This directive sets whether to perform Gzip compression on the results returned by the server

| Syntax | gzip_proxied off| expired |no-cache| no-store|private |
no_last_modified|no_etag|auth|any ; |


off - turn off the Nginx server's Gzip compression of the results returned by the background server
expired - enable compression, if the header contains "Expires" header information
no-cache - enable compression, if the header contains "Cache-Control:no-cache" header information
no-store - enable compression, if the header contains "Cache-Control: no-store" header information
private - enable compression, if the header contains "Cache-Control: private" header information
no_last_modified - enable compression, if the header The header does not contain "Last-Modified" header information
no_etag - enable compression, if the header does not contain "ETag" header information
auth - enable compression, if the header contains "Authorization" header information
any - enable compression unconditionally

Configuration example

http {
  server {
      gzip on; #开启gzip功能
      gzip_types *; #压缩源文件类型,压缩所有
      gzip_comp_level 6; #gzip压缩级别
      gzip_vary on;  #往头信息中添加压缩标识
      gzip_min_length 1k; #进行压缩响应页面的最小长度,content-length
      gzip_http_version 1.1; #指定压缩响应所需要的最低HTTP请求版本
      gzip_disable "MSIE[1-6]\.";  #对IE6以下的版本都不进行压缩
      gzip_proxied off; #nginx作为反向代理不压缩服务端返回数据
      gzip_buffers 4 16k; #缓存空间大小

      listen 8072;
      server_name localhost;
      location /gzip {
         root  /home/nginx/html;
      }
  }
}
  • Requests without gizp compression enabled

insert image description here
insert image description here

  • Request to enable gizp compression
    insert image description here
    insert image description here

  • Configure no compression below 100k
    insert image description here

insert image description here

insert image description here

  • Enable specified file compression

insert image description here

insert image description here

Coexistence of Gzip and sendfile

After it is turned on sendfile, when reading static resource files on the disk, the number of copies can be reduced, and the static files can be sent out through the network device without going through the user process, but if Gzip wants to compress resources, it needs to be operated through the user process of. It can be resolved using ngx_http_gzip_static_modulethe module's directives. It is allowed to send pre-compressed files with ".gz" as the file extension instead of sending ordinary files. Nginx does not add the ngx_http_gzip_static_module module by default. You need to add the module manually. For details, please refer to Nginx Hot Deployment under "Nginx Basic Concepts"gzip_static
ngx_http_gzip_static_module

  • Installngx_http_gzip_static_module模块
    1. View the current configuration parameters of nginx
    2. Back up the current nginx binary file to prevent upgrade failure
    3. Enter the nginx decompression directory, first execute make cleanto clear the previously compiled content, and then execute the ./configure command, the parameters are the current nginx configuration parameters plus --with-http_gzip_static_modulefor example:

./configure --prefix=/home/nginx --with-http_gzip_static_module --with-http_gzip_static_module

  1. Enter the objs directory, copy the nginx binary file to the sbin directory under the nginx installation directory
  2. Switch back to the compilation directory of nginx and execute make upgradethe command
  • gzip_static directive

When checking the .gz file with the same name as the accessed resource, that is, ngx_http_gzip_static_modulethe module and the compressed file, when the requested file is pre-compressed with the same name as the .gz file, the pre-compressed file will be returned directly, such as the requested file, if jquery.jsthere is a file in the disk jquery.js.gz, it will be returned directly jquery.js.gz. The response returns the content of the .gz file with the gzip-related header.

grammar gzip_static on | off | always;
Defaults gzip_static off;
Location http、server、location

Notice:

  1. gzip_static configuration priority is higher than gzip.
  2. After enabling nginx_static, for any file, it will first check whether there is a corresponding gz file.
  3. The gzip_types setting has no effect on gzip_static.
  4. gzip static applies to HTTP 1.1 by default.
  • Configuration case
server {
    sendfile on; # 开启sendfile
    gzip_static on; # 开启gzip_static
    gzip on;
    gzip_types application/javascript;
    gzip_comp_level 6;
    gzip_vary on;
    gzip_min_length 100k;
    gzip_http_version 1.1;
    gzip_disable "MSIE[1-6]\.";
    gzip_proxied off;
    gzip_buffers 4 16k;

    listen 8072;
    server_name localhost;
    location /gzip {
       root  /home/nginx/html;
    }
}
  1. Compress the chunk.js file into a gz file

gzip chunk.js
insert image description here
ng&originHeight=168&originWidth=490&size=15249&status=done&style=none&width=490)

  1. Access chunk.js, the response body uses gizp compression

insert image description here

Guess you like

Origin blog.csdn.net/u010859650/article/details/127899415