网站速度优化技巧:Nginx设置js、css过期时间

原文:http://www.webkaka.com/blog/archives/Nginx-set-the-expiration-time-for-js-and-css.html

配置Nginx expires缓存实现性能优化

原文:https://blog.webfsd.com/post_pei-zhinginx-expires-huan-cun-shi-xian-xing-neng-you-hua.html

网站设置Js、css等文件的过期时间,是提升网站速度的基本技巧方法之一,之前写过如何在IIS设置网页内容过期时间一文,满足了部分网友的需要,最近有网友在群里提到,他们使用的是Nginx服务器,但还不知如何设置Js、css文件过期时间,故写下此教程,以便查看。

Nginx如何设置Js、css等文件的过期时间

首先打开配置文件/etc/nginx/nginx.conf,然后找到下面这句话:

location~ .*\.(gif|jpg|png|htm|html|css|js|flv|ico|swf)(.*) {
                   expires 30d;
             }

设置expires这个参数即可,30d表示30天,注意后面有个分号“;”。

如果过期时间为小时,则用“h”,如“expires 1h;”表示文件缓存在1小时后过期。看看下面的范例:

#图片缓存30天
      location ~.*\.(jpg|png|jpeg)$  
      {  
        expires 30d;  
      }
 
      #js css缓存一小时
      location ~.*\.(js|css)?$  
      {  
        expires 1h;  
      }

语法解释

nginx作为web服务器,有时需要让浏览器缓存(Browser Caching) 是为了加速浏览并节约网络资源,浏览器在用户磁盘上对最近请求过的文档进行存储。
 
      nginx通过expires指令来设置浏览器的Header

语法: expires [time|epoch|max|off]
      默认值: expires off
      作用域: http, server, location

使用本指令可以控制HTTP应答中的“Expires”和“Cache-Control”的头标,(起到控制页面缓存的作用)。

可以在time值中使用正数或负数。“Expires”头标的值将通过当前系统时间加上您设定的 time 值来获得。

epoch 指定“Expires”的值为 1 January, 1970, 00:00:01 GMT。

max 指定“Expires”的值为 31 December 2037 23:59:59 GMT,“Cache-Control”的值为10年。

-1 指定“Expires”的值为服务器当前时间;-1s,表示永远过期,即不缓存文件。

如何检测网页过期设置是否生效?

打开webkaka的网站速度诊断工具(http://pagespeed.webkaka.com/),输入你的网页地址,检测后,立即可以看到设置是否生效了。

检测网页缓存是否生效

上图看到,被检测网页的js、css文件过期时间为1天。

(转)网站速度优化技巧:Nginx设置js、css过期时间的更多相关文章

  1. DEDE网站地图优化技巧

    DEDE网站地图优化技巧-把网站地图生成在系统根目录,利于搜索引擎收录相信恨多用DEDECMS做站的朋友,为避免将data目录内的东西随便外泄,在robots中将data目录屏蔽了,但是DEDE默认的 ...

  2. Redis五种数据类型-设置key的过期时间

    1.redis命令客户端 [root@localhost bin]# ./redis-cli 127.0.0.1:6379> #是否运行着 127.0.0.1:6379> ping PON ...

  3. RabbitMQ 设置队列的过期时间

    设置队列的过期时间非常简单,在声明队列时,设置x-expires参数即可.当队列的生存周期超时后,RabbitMQ server会自动将该队列删除. 代码如下: channel.QueueDeclar ...

  4. netty系列之:一个价值上亿的网站速度优化方案

    目录 简介 本文的目标 支持多个图片服务 http2处理器 处理页面和图像 价值上亿的速度优化方案 总结 简介 其实软件界最赚钱的不是写代码的,写代码的只能叫马龙,高级点的叫做程序员,都是苦力活.那么 ...

  5. Nginx设置Js、Css等静态文件的缓存过期时间

    location ~.*\.(js|css|html|png|jpg)$ { expires 3d; } expires    3d; //表示缓存3天 expires    3h; //表示缓存3小 ...

  6. Web性能优化之动态合并JS/CSS文件并缓存客户端

    来源:微信公众号CodeL 在Web开发过程中,会产生很多的js/css文件,传统的引用外部文件的方式会产生多次的http请求,从而加重服务器负担且网页加载缓慢,如何在一次请求中将多个文件一次加载出来 ...

  7. 详解 nginx location ~ .*\.(js|css)?$ 什么意思?

    语法规则: location [=|~|~*|^~] /uri/ { … } = 开头表示精确匹配 ^~ 开头表示uri以某个常规字符串开头,理解为匹配 url路径即可.nginx不对url做编码,因 ...

  8. nginx配置静态文件过期时间

    1. 编辑虚拟主机配置文件/usr/local/nginx/conf/vhosts/huangzhenping.conf 说明:采用location方式 1 2 3 4 5 6 7 8 9 10  l ...

  9. thinkphp3.2设置session的过期时间

    thinkPHP3.2中session的过期时间配置是不能使用的,我们需要修改一下它的配置文件thinkPHP>common>functions.php,找到这一行: if(isset($ ...

随机推荐

  1. 什么是Condition Number(条件数)?

    In the field of numerical analysis, the condition number of a function with respect to an argument m ...

  2. 编写高质量代码改善C#程序的157个建议——建议5: 使用int?来确保值类型也可以为null

    建议5: 使用int?来确保值类型也可以为null 基元类型为什么需要为null?考虑两个场景: 1)数据库中一个int字段可以被设置为null.在C#中,值被取出来后,为了将它赋值给int类型,不得 ...

  3. HackSix 为ViewGroup的子视图添加悦目的动画效果

    1.默认情况下他,添加到viewGrop的子视图是直接显示出来的.有一个比较简单的方法可以为这个过程增加动画效果. 2.知识点:     给子视图添加动画效果就用:LayoutAnimationCon ...

  4. SQL 2005报错之Restore fail for Server 'DatabaseServerName'.

    Restore fail for Server 'DatabaseServerName'.(Microsoft.SqlServer.Smo) Additional information: Syste ...

  5. wp后台更新瓷片

    下载源码 还有一种方式,更新瓷片方式 1. /// <summary> /// 定时更新磁贴 /// </summary> public class ShellUpdate { ...

  6. 【kudu pk parquet】TPC-H Query2对比解析

    这是[kudu pk parquet]的第二篇,query2在kudu和parquet上的对比解析,其中kudu包含有不能下发的谓词. 3台物理机,1T规模的数据集,impala和kudu版本是我们修 ...

  7. php代码审计9审计反序列化漏洞

    序列化与反序列化:序列化:把对象转换为字节序列的过程称为对象的序列化反序列化:把字节序列恢复为对象的过程称为对象的反序列化 漏洞成因:反序列化对象中存在魔术方法,而且魔术方法中的代码可以被控制,漏洞根 ...

  8. atp

    一. 新建atp目录,该目录下包含bin(存放启动程序等).config(存放配置程序).lib(存放过程程序).logs(存放生成的日志).cases(存放用例的excel文件)五个目录,并新建一个 ...

  9. 【转】C#中的combobox里DropDownStyle

    源地址:https://blog.csdn.net/cf643487053/article/details/54016822 C#中的combobox控件里DropDownStyle有三种选项 Sim ...

  10. 洛谷P4525 【模板】自适应辛普森法1

    题面 传送门 题解 我似乎连积分都不太熟练→_→ 总之就是对于一个原函数,我们找一个二次函数来近似它,那么有 \[ \begin{aligned} \int_a^bf(x)dx &\appro ...