Nginx study notes (seven) - Nginx configuration page to achieve Gzip compression, picture compression

First, the page compression

In practical applications, we take up less resources as possible in order to make the nginx, and a lot of high-definition pictures and pages contain a large amount of information we will take up a lot of resources. This is not conducive to performance optimization nginx, in order to solve this problem, we can do Gzip compression.

Nginx performance optimization features: Gzip compression (significantly improve page load speed)Open Gzip compression feature that allows website css, js, xml, html files compressed in the transmission, increase access speed, to optimize the performance of Nginx. After Gzip compressed into the original page size can be 30% or less, so that when users browse pages much faster. Gzip compression page requires a browser and server support both, in fact, is a server-side compression, passed after the explorer decompression and resolution. Browser where we do not need to worry, because the great majority of current browsers support Gzip resolved through the pages.

1, modify the configuration file/usr/local/nginx/conf/nginx.conf

 33     gzip  on;
 	# 开启gzip压缩功能
 34     gzip_min_length 1;
 	# 设置允许压缩的页面最小字节数;
 35     gzip_comp_level 2;
 	# 设置压缩比率,最小为1,处理速度快,传输速度慢;9为最大压缩比,处理速度慢,传输速度快; 这里表示压缩级别,可以是09中的任一个,级别越高,压缩就越小,节省了带宽资源,但同时也消耗CPU资源,所以一般折中为6
 36     gzip_types  text/plain application/x-javascript  test/css  application/xml  vascript applic        ation/x-httpd/php  image/gif   image/png;
 	#制定压缩的类型,线上配置时尽可能配置多的压缩类型

Here Insert Picture Description2, edit the default nginx release files/usr/local/nginx/html/index.html

[root@server2 html]# ls
50x.html  index.html
[root@server2 html]# pwd
/usr/local/nginx/html
[root@server2 html]# cp /etc/passwd .
[root@server2 html]# ls
50x.html  index.html  passwd
[root@server2 html]# du -sh passwd 
4.0K	passwd
[root@server2 html]# vim passwd 
[root@server2 html]# du -sh passwd 
44K	passwd
[root@server2 html]# mv passwd index.html
mv: overwrite ‘index.html’? y
[root@server2 html]# du -sh index.html
44K	index.html

3, and then view the page size (press F12, then select Network-> Size, will be able to view their file size)
4, restart the service nginx -s reload, clear the cache to see again

Second, the picture compression

1, stop the service, recompilation. Add a new module

[root@server2 nginx-1.15.9]# make clean
[root@server2 nginx-1.15.9]# ./configure \
> --prefix=/usr/local/nginx  \
> --pid-path=/var/run/nginx/nginx.pid \
> --lock-path=/var/lock/nginx.lock \
> --error-log-path=/var/log/nginx/error.log \
> --http-log-path=/var/log/nginx/access.log \
> --with-http_realip_module  --with-http_image_filter_module=dynamic
[root@server2 nginx-1.15.9]# make
[root@server2 nginx-1.15.9]# cd objs/
[root@server2 objs]# ls
autoconf.err  nginx.8             ngx_http_image_filter_module_modules.c  ngx_modules.c
Makefile      ngx_auto_config.h   ngx_http_image_filter_module_modules.o  ngx_modules.o
nginx         ngx_auto_headers.h  ngx_http_image_filter_module.so         src
[root@server2 objs]# cp nginx  -f  /usr/local/nginx/sbin/nginx  
	#将新的二进制文件替换成之前的二进制文件
cp: overwrite /usr/local/nginx/sbin/nginx’? y
[root@server2 objs]# mkdir /usr/local/nginx/modules 
	#创建新的目录,并将图像模块放在目录下
[root@server2 objs]# cp ngx_http_image_filter_module.so  /usr/local/nginx/modules

Here Insert Picture Description
2, edit the nginx configuration file /usr/local/nginx/conf/nginx.conf, reload.

 1 load_module  modules/ngx_http_image_filter_module.so;

 47         location /search/ {
 48                 image_filter  resize 50  100;
 49                 }

Here Insert Picture Description

3, the test
Here Insert Picture Description

Here Insert Picture Description

In the above picture we can learn to share, have to enter the full path to the query in the browser, including the name of the picture, but this is obviously unreasonable, we believe that the pictures are placed in a directory, by looking select a picture directory is a good way

Published 102 original articles · won praise 21 · views 5245

Guess you like

Origin blog.csdn.net/ranrancc_/article/details/104034082