使用背景
前端优化的黄金准则指导着前端页面的优化策略：只有10%-20%的最终用户响应时间花在接受请求的HTML文档上，剩下的80%-90%时间花在为HTML文档所引用的所有组件（图片、脚本、样式表等）进行的HTTP请求上。因此，改善响应时间的最简单途径就是减少组件的数量，并由此减少HTTP请求的数量。（）
在页面中一般会有很多的js脚本和css样式表文件，如果一个个的请求这些文件，肯定会是页面的http请求数增多，与上面所说的前端的优化原则相违背。如果我们可以把这些js、css文件合并请求，减少三次握手的次数和多余的HTTP头部传输降低响应时间提高用户体验。那么就可以完美解决这个问题。这里就需要借助写nginx的concat插件。
模块介绍
mod_concat模块由淘宝开发，目前已经包含在tengine中，并且淘宝已经在使用这个nginx模块。不过塔暂时没有包含在nginx中。这个模块类似于apache中的modconcat。如果需要使用它，需要使用两个”?”问号。来个范例：
http://example.com/??style1.css,style2.css,foo/style3.css
以上将原先3个请求合并为1个请求
如果你担心文件被用户的浏览器缓存而没有及时更新，你依旧可以带上一个版本号的参数，如下：
http://example.com/??style1.css,style2.css,foo/style3.css?v=102234
concat安装
# cd /usr/local/src/# wget http://nginx.org/download/nginx-1.4.2.tar.gz# wget https://github.com/alibaba/nginx-http-concat/archive/master.zip -O nginx-http-concat-master.zip# unzip nginx-http-concat-master.zip# tar -xzvf nginx-1.4.2.tar.gz# cd nginx-1.4.2# ./configure --prefix=/usr/local/nginx-1.4.2 --with-http_stub_status_module \--add-module=../nginx-http-concat-master# make# make install
http://code.taobao.org/svn/nginx_concat_module/trunk nginx_concat_module
concat配置
server { listen 80; server_name root /data/site/ location /static/ { concat on; #开启服务 concat_max_files 20; #设置合并的最大文件数为20 concat_unique on; #只允许同类文件合并 concat_types text/html,text/css; #允许合并的文件类型 }} concat使用
现在我们在网站目录下放置2个js文件，1.js和2.js
我们可以通过http://192.168.0.10/??1.js,2.js访问，发现2个JS的文件都在我们访问的页面里面了；然后我们在网站根目录下新建一个目录abc，在目录abc里面放上3.js，然后我们通过域名访问http://192.168.0.1 /??1.js,2.js,abc/3.js访问，3个js的内容都在我们访问的页面上了，在这里，大家注意下，我们展示出来的页面里面内容的顺序是和我们访问的文件的排序有关的，排在最前面的文件，就现在在最上面，依次排列，排在最后的文件就在最下面显示出来。