現在的網站表現力越來越豐富，頁面加載的js和css自然也越來越多。當網站頁面上的js和css太多，浏覽器打開頁面的速度就會很慢，明顯降低了使用者的體驗。使用mod_concatx, 可以合并多個檔案在一個http響應封包中，可以有效提高js/css的加載速度。
一直想研究這個技術，但是賴于自己的雙手，今天逼着自己把這東西搞了出來，并且形成文檔。
介紹：
mod_concat子產品由淘寶開發，目前已經包含在tengine中，并且淘寶已經在使用這個nginx子產品。不過它暫時沒有包含在nginx中。這個子產品類似于apache中的modconcat。如果需要使用它，需要使用兩個"?"問号.
事例：http://cssijsgroup.sir.com/style/??aa/b.js,aa/a.js,aa/c.css
安裝：
首先下載下傳這個子產品： wget https://github.com/alibaba/nginx-http-concat/archive/master.zip -O nginx-http-concat-master.zip
解壓這子產品：unzip nginx-http-concat-master.zip
重新編譯nginx，編譯之前為了不影響之前nginx的功能，要使用nginx -V檢視以下之前的編譯參數，然後在最後面增加 --add-module=../nginx-http-concat-master即可。
使用說明：
concat on | off
default: concat off
context: http, server, location
開啟火關閉concat
concat_types MIME types
default: concat_types: text/css application/x-javascript
Defines the MIME types which can be concatenated in a given context.
在給定的配置段中可以被合并的MIME檔案類型.
concat_unique on | off
default: concat_unique on
是否隻允許同類型檔案（相同MIME檔案）合并。例如，設定為off，那麼js和css檔案可以合并。預設
情況下，這個值是on，意味着隻有相同的類型檔案才能合并。
如果希望js和css能夠合并為一個請求，那麼你必須設定concat_unique off，其他類型檔案也可以用
同樣的方式合并.如下為OFF才可以的請求：
http://example.com/static/??foo.css,bar/foobaz.js
concat_max_files numberp
default: concat_max_files 10
定義一個給定的配置段裡面允許合并檔案的數量，預設最多10個.不過一定要注意，uri不要超過系統的
規定的page size，在linux裡面執行getconf PAGESIZE可以擷取系統的限制.通常限制是4096位元組。
concat_delimiter: string
default: NONE
context: http, server, locatione
定義檔案分隔符
concat_ignore_file_error: on | off
default: off
是否忽略檔案請求錯誤，例如404和403等
配置Nginx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<code>server {</code>
<code> </code><code>listen 80;</code>
<code> </code><code>server_name cssijsgroup.sir.com;</code>
<code> </code><code>root </code><code>/Disk/var/www/group</code><code>;</code>
<code> </code><code>index index.html index.htm;</code>
<code> </code><code>location / {</code>
<code> </code><code>}</code>
<code> </code><code>location </code><code>/style/</code> <code>{</code>
<code> </code><code>concat on;</code>
<code> </code><code>concat_max_files 20;</code>
<code> </code><code># 開始筆者這裡沒寫這句話，心想nginx預設就是js和css，可是通路的時候卻得到了400結果的結果</code>
<code> </code><code>concat_types text</code><code>/css</code> <code>application</code><code>/javascript</code><code>; </code>
<code> </code><code>concat_unique off;</code>
<code> </code><code>}</code>
<code> </code><code>error_page 404 500 502 503 504 </code><code>/404</code><code>.html;</code>
<code> </code><code>location = </code><code>/404</code><code>.html {</code>
<code> </code><code>root </code><code>/usr/share/nginx/html</code><code>;</code>
<code>}</code>
測試前準備下對應的css和js檔案
<code>root@ubuntusvn:</code><code>/Disk/var/www/group/style/aa</code><code># ls</code>
<code>a.js b.js c.css</code>
<code>root@ubuntusvn:</code><code>/Disk/var/www/group/style/aa</code><code># cat *</code>
<code>aaaaa</code>
<code>bbbbbb</code>
<code>alsdkjfcss</code>
<code>root@ubuntusvn:</code><code>/Disk/var/www/group/style/aa</code><code>#</code>
測試：
<code>root@ubuntusvn:</code><code>/Disk/var/www/group/style/aa</code><code># curl http://cssijsgroup.sir.com/style/??aa/b.js,aa/a.js</code>
<code>root@ubuntusvn:</code><code>/Disk/var/www/group/style/aa</code><code># curl http://cssijsgroup.sir.com/style/??aa/b.js,aa/c.css</code>
<code>root@ubuntusvn:</code><code>/Disk/var/www/group/style/aa</code><code># curl http://cssijsgroup.jinlejia.com/style/??aa/b.js,aa/c.css,aa/b.js</code>
閑聊：
如果把配置放到nginx的location /目錄節點下，照樣生效的，親測，看效果：
<code>root@ubuntusvn:</code><code>/etc/nginx/conf</code><code>.d</code><code># cat /etc/nginx/conf.d/groupcssjs.conf </code>
<code> </code><code>location / {</code>
<code>root@ubuntusvn:</code><code>/etc/nginx/conf</code><code>.d</code><code># curl http://cssijsgroup.sir.com/??style/aa/b.js,style/aa/c.css</code>
總計：
筆者最開始接觸網際網路的時候，做的第一個網站就是跨境電商的網站，由于前台有N多的靜态檔案，而且伺服器托管在國外的機房中，導緻網站通路的速度非常慢，當時不知道有這麼一項技術，現在知道了這項技術，大大提高的我們網站的速度，進而還降低了nginx伺服器的并發數，而且還降低了背景日志管理的麻煩。
本文轉自 xinsir999 51CTO部落格，原文連結：http://blog.51cto.com/xinsir/1970189，如需轉載請自行聯系原作者
![MySQL - order by排序優化[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)