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. Spark-submit脚本解读

    #!/usr/bin/env bash # # Licensed to the Apache Software Foundation (ASF) under one or more # contrib ...

  2. tiny4412 串口驱动分析五 --- LDD3上TTY驱动程序源码

    关于tty这部分请参考: <Linux设备驱动开发详解 第二版>第14章 Linux终端设备驱动 <精通Linux设备驱动程序开发>第6章 串行设备驱动程序 <Linux ...

  3. jquery 纯JS设置select下拉框,并默认选中第一个

    //html页面<select id="payWay" class="easyui-combobox" name="payWay" s ...

  4. 容器窗口 <QTabWidget>

    ////////////////////////////////////////// #include "test9_2a.h" #include "M_win.h&qu ...

  5. Java 实现模板方法(TemplateMethod)模式

    类图 /** * 业务流程模板.提供基本框架 * @author stone * */ public abstract class BaseTemplate { public abstract voi ...

  6. Pro Tools安装图文教程

    Pro Tools安装图文教程   Avid Pro Tools是Digidesign公司出品的一款音质最佳.音频制作强大的软件,能够在Mac或PC上为影片编曲.录制.编辑和混制高品质音乐或声音,生成 ...

  7. 作者:wallimn

    经过这几天对DHTMLXTree的折腾总算是有点眉目了.领导催得紧.组长紧的催. 唉,把握这次机会来好好总结一下DHTMLXTree. 还是老套路.首先来简单了解一下DHTMLXTree. DHTML ...

  8. selenium从入门到应用 - 6,EventFiringWebDriver和监听器

    本系列所有代码 https://github.com/zhangting85/simpleWebtest 本文将介绍一个Java+TestNG+Maven+Selenium的web自动化测试脚本环境下 ...

  9. css3中的新特性经典应用

    这篇文章主要分析css3新特性的典型应用,都是干活,没得水分. 1.动画属性:animation. 利用animation可以实现元素的动画效果,他是一个简写属性,用于设置6个动画属性:aminati ...

  10. 未能加载文件或程序集 MySql.Web

    偶然间碰到这个错误,找到一个临时的解决办法,真正的原因还不知道是什么,也不知道这种解决方法会不会对以后有什么副作用. “/”应用程序中的服务器错误. 配置错误 说明: 在处理向该请求提供服务所需的配置 ...