http://homeway.me

0x01.About

源代码已经上传到github:https://github.com/grasses/nginx-lua-static-merger

nginx-lua-static-merger是一个基于openresty的模块,主要用于合并静态文件。降低http请求,加快静态文件訪问速度的模块。

使用nginx-lua-static-merger 须要在编译nginx时候加入openresty的模块,或者直接安装openresty作为server。

nginx-lua-static-merger能够让你的js、css请求不要那么多。一个就够了。


0x02.About Nginx

nginx工作

先从nginx原理来看nginx处理http请求的过程。

Nginx的模块从功能上分为例如以下三类:

Handlers(处理器模块),直接处理请求,并进行输出内容和改动headers信息等操作。Handlers处理器模块一般只能有一个。

Filters (过滤器模块),主要对其它处理器模块输出的内容进行改动操作,最后由Nginx输出。

Proxies (代理类模块),Nginx的HTTP Upstream之类的模块。这些模块主要与后端一些服务比方FastCGI等进行交互。实现服务代理和负载均衡等功能。

也就是说。一个http请求过来,nginx先处理请求信息,然后过滤信息,最后丢给代理来处理,它本身处理的东西并不多。它不过通过查找配置文件将此次请求映射到一个location block,而此location中所配置的各个指令则会启动不同的模块去完毕工作。

从正常来看,一个页面载入10来个js、css是正常的,还有10来个图片,即使是什么也不干。那么一个页面也要处理掉20多个http请求,每一个http请求都要跑一遍TCP请求,nginx回应。过滤,分配。

speed test:

看张图吧,国外一个网速測试工具:

去掉首页index.html的载入时间。能够看到,载入静态文件css,js时间耗费了非常长的等待时间。而且image的载入是在js和css载入完后才载入的。也就是说,假设js或css载入慢了,那么页面就慢了。

这个页面是github.com/grasses。


0x02.Usage

Openresty

http://openresty.org/cn/

Openresty是国人写的开源项目,打包了标准的 Nginx 核心。非常多的经常使用的第三方模块,以及它们的大多数依赖项。

tar xzvf ngx_openresty-VERSION.tar.gz
cd ngx_openresty-VERSION/
./configure
make
make install

具体的安装教程还是去看官网吧。

file path

|--/usr/local/openresty/nginx
| `--lua
| `--nginx-lua-static-merger.lua
| `--conf
| `--nginx.lua
|--/www/openresty/static
| `--js
| `--css
| `--cache

注意

1、nginx.conf中的lua_package_path "/usr/local/openresty/lualib/?.lua;;";

lua_package_cpath "/usr/local/openresty/lualib/?.so;;";,假设你是编译nginx而不是直接安装openresty,文件夹记得放对。

2、确保/www/openresty/static有Lua写的权限。

use

前端调用方法例如以下:

<link rel="stylesheet" href="/bootstrap/css/bootstrap.min.css;/qiniu/css/main.css;/css/navbar.css">
<script src="/js/jquery.min.js;/js/main.js;/qiniu/bootstrap/js/bootstrap.min.js;/qiniu/js/plupload/plupload.full.min.js;/qiniu/js/plupload/i18n/zh_CN.js"></script>

0x03.How it work

Nginx在location通过 content_by_lua_file 把接下来的处理丢个Lua做逻辑。

Lua通过uri进行md5编码,推断cache是否存在,假设cache不存在。循环切割、遍历uri,訪问响应的路径。查找静态文件,存在则记录,最后写cache入文件。方便下次訪问。


0x04.Effect

以下是在不作处理情况请求多个js结果:

以下是第一次请求下,lua既要获取数据又要合并生成cache,属于冷数据:

第二次訪问就是热数据了,訪问速度是添加的:


本文出自 夏日小草,转载请注明出处:http://homeway.me/2015/06/22/nginx-lua-static-merger/

-by小草

2015-06-22 20:04:10

[原]Nginx+Lua服务端合并静态文件的更多相关文章

  1. IE8下服务端获取客户端文件的路径为C:/fakePath问题的解决方案

    上一篇文章上提到,IE8下服务端获取客户端文件的路径时,会变成C:/fakePath问题,于是乎通过文件路径去获得文件大小就失败了. 上网搜了一下,主要原因是IE8因为安全考虑,在上传文件时屏蔽了真实 ...

  2. C# TCP实现多个客户端与服务端 数据 与 文件的传输

    C#菜鸟做这个东东竟然花了快三天的时间了,真是菜,菜,菜--- 下面是我用C#写的 一个简单的TCP通信,主要的功能有: (1) 多个客户端与服务器间的数据交流 (2)可以实现群发的功能 (3)客户端 ...

  3. Nginx对于图片,js等静态文件的缓存设置

    以下是自学it网--中级班上课笔记 网址:www.zixue.it Nginx对于图片,js等静态文件的缓存设置 注:这个缓存是指针对浏览器所做的缓存,不是指服务器端的数据缓存. 主要知识点: loc ...

  4. Node.js:上传文件,服务端如何获取文件上传进度

    内容概述 multer是常用的Express文件上传中间件.服务端如何获取文件上传的进度,是使用的过程中,很常见的一个问题.在SF上也有同学问了类似问题<nodejs multer有没有查看文件 ...

  5. Socket服务端和客户端文件传输

    很多朋友在使用socket编程时不可避免的都做过文件传输,而视频电影等需要一个字节一个字节的传输:但是客户端一般都通过-1进行终止,服务也一样:但是存在的问题是客户端永远不会把-1传递给服务端:因此经 ...

  6. 编写Java程序,实现客户端向服务端上传文件的功能

    查看本章节 查看作业目录 需求说明: 实现客户端向服务端上传文件的功能 当启动服务端后,运行客户端程序,系统提示客户在客户端输入上传文件的完整路径.当客户在客户端输入完成后,服务端实现文件上传 实现思 ...

  7. nginx优化:使用expires在浏览器端缓存静态文件

    一,nginx中expires指令的作用 网站的图片等静态文件一旦发布,通常很少改动, 为了减小对服务器请求的压力,提高用户浏览速度, 我们可以设置nginx中的expires, 使用户访问一次后,将 ...

  8. 数往知来 ASP.NET 模拟服务器:服务端_静态页面_动态页面的响应<十七>

      一.客户端是怎么看到我们的网页的呢/ 在浏览器端,如果用汉语请求的是一普通的HTML网页,呢么我们的IIS服务器, 接收到请求以后,那么从IIS服务器所在的电脑区查找该HTML网页, 找到以后将该 ...

  9. 使用nginx缓存服务器上的静态文件

    一.nginx缓存的优点 如图所示,nginx缓存,可以在一定程度上,减少源服务器的处理请求压力. 因为静态文件(比如css,js, 图片)中,很多都是不经常更新的.nginx使用proxy_cach ...

随机推荐

  1. espresso Seekbar

    package test.utils; import android.support.test.espresso.PerformException; import android.support.te ...

  2. jsonObject关于xml,json,bean之间的转换关系

    1.json转换为JAVA @Test public void jsonToJAVA() { System.out.println("json字符串转java代码"); Strin ...

  3. [置顶] kubernetes资源对象--limitranges

    概念 LimitRange(简称limits)基于namespace的资源管理,包括pod和container的最小.最大和default.defaultrequests等. 一旦创建limits,以 ...

  4. python 常用的模块(hashlib)转

    摘要算法简介 Python的hashlib提供了常见的摘要算法,如MD5,SHA1等等. 什么是摘要算法呢?摘要算法又称哈希算法.散列算法.它通过一个函数,把任意长度的数据转换为一个长度固定的数据串( ...

  5. C++ 获取URL图片、html文件,CInternetSession 【转】

    http://blog.csdn.net/gnixuyil/article/details/7688439 获取网络图片 CString URL="http://www.google.com ...

  6. checkStyle总结

    参考网站:https://code.google.com/p/testcq/wiki/CheckStyleRules 1.Variable access definition in wrong ord ...

  7. [转载]java自带线程池和队列详细讲解

    FROM:http://blog.csdn.net/sd0902/article/details/8395677 一简介 线程的使用在java中占有极其重要的地位,在jdk1.4极其之前的jdk版本中 ...

  8. dmz主机就是DNAT功能的体现

    端口映射和DMZ是提供内网和外网映射的,具体各自如下:DMZ:就相当于DNAT(Destination NAT),只对目的IP地址做地址转换.也就是说,收到目的IP为自己WAN口的包,统统转发给内网的 ...

  9. ITIL,是否已是昨日黄花

    首先声明自己不是ITIL方面的专家,特别是具体的规范细节,后面论述如有不当,请指正.但我为什么会提起它?主要是因为它和运维(IT服务管理)相关性太大了.早起的运维完全就是以ITIL来蓝本构建的,在当时 ...

  10. [PWA] Access the Camera in a PWA built with React

    It's possible to access some, but not all, of the native device features from a PWA. One that we can ...