[原]Nginx+Lua服务端合并静态文件

 

 

 

 

 

0x01.About

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

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

使用nginx-lua-static-merger 需要在编译nginx时候添加openresty的模块，或者直接安装openresty作为服务器。

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

 

 <喎?http://www.Bkjia.com/kf/ware/vc/" target="_blank" class="keylink">vcD4NCjxwPiZuYnNwOzwvcD4NCjxociAvPg0KPGJyIC8+DQo8cD4mbmJzcDs8L3A+DQo8aDEgaWQ9"0x02about-nginx">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

前端调用方法如下：

<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，属于冷数据：

 

 

 

第二次访问就是热数据了，访问速度是增加的：

 

 

 

---