Posted by:
努力记

努力记,通过记录,计划,让自己的努力可以触碰彩虹!

2,792

Nginx:静态文件优化三部曲

  • 2013-06-02
  • 2 评论

Nginx作为web服务器,对于静态文件的优化有很多的长处
在此我就将静态文件优化分为3步,实现高性能的读取

注:通常所指的静态文件为:js,css,jpg,jpeg,png,gif,swf等

将Nginx作为前端反向代理,缓存静态文件

Nginx提供代理缓存,在此技术上显示缓存静态文件,能大大提高资源的获取速度,显著降低系统调用静态资源所产生的I/O瓶颈

http{
//反向代理设置
upstream realserver{
		server localhost:88;
}
proxy_connect_timeout 5;
proxy_read_timeout 60;
proxy_send_timeout 5;
proxy_buffer_size 16k;
proxy_buffers 4 64k;
proxy_busy_buffers_size 128k;
proxy_temp_file_write_size 128k;
proxy_temp_path /tmp/proxy_temp_dir;
//代理缓存设置
proxy_cache_path /tmp/proxy_cache_dir levels=1:2 keys_zone=cache_one:100m inactive=1d max_size=10g;
}
location / {
//代理设置
proxy_pass http://realserver;//对应upstream后的名称
proxy_setHeader Host $host;
proxy_setheader X-Forwarded-For $remote_addr;
//代理缓存设置
proxy_cache cache_one;//对应proxy_cache_path中的keys_zone
proxy_cache_valid 200 304 1d;//对于200及304的http页面缓存
proxy_cache_key $host$uri$is_args$args;//缓存的key值
}

 

Gzip压缩及设定HTTP请求头

http{
gzip on;
gzip_min_length 1k;
gzip_buffers 4 16k;
gzip_comp_level 2;
gzip_types text/plain application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
gzip_disable "MSIE [1-6]\.";
}
server{
gzip_proxied any;//对于任意访问都进行gzip压缩
//如果是后端服务器,则需要设置
gzip_vary on;//用于写响应头Vary: Accept-Encoding,让前端代理进行压缩
}
Localation / {
expires 1d;//写请求响应头
}

 

利用模块,压缩js及css,自动生成图片缩略图

我推荐3个模块针对静态文件进行优化:

  • ngx_pagespeed:这款是google开发的对于页面加速,提供全面的解决方案,内部功能很多,上诉2个步骤的功能也包含,还能去除js和css文件中的空白换行等,进行文件压缩
  • ngx_image_thumb:主要功能是对请求的图片进行缩略/水印处理,支持文字水印和图片水印,程序中不用对用户上传的图片进行处理,在需要的时候才生成所需的图片,无疑,该模块成为图片处理的利器,开源中国上有针对该模块的详细说明,点击
  • ngx_http_concat:主要功能是实现对于js和css文件的合并,用一个请求实现多个文件调用,可以有效的降低页面的请求数


back up ↑

无觅相关文章插件,快速提升流量