合并多個CSS或者js文件用來Minify優(yōu)化網(wǎng)站性能

一般情況下，網(wǎng)站速度的瓶頸都在前端，而最關(guān)鍵的就是資源的加載速度，但是大多數(shù)瀏覽器都有單個域名并發(fā)請求數(shù)限制，所以如果一個頁面中存在很多的資源，比如CSS和JavaScript文件，那么明顯會降低網(wǎng)站的加載速度，比較好處理方式就是把多個文件通過一個請求來訪問，這樣既不會影響之前的文件維護，又會減少資源的清楚數(shù)量，Minify就是為之而生。下面是一些被Minify采用的 Yahoo！ 優(yōu)化準(zhǔn)則：

1、Make Fewer HTTP Requests

2、Add an Expires or a Cache-Control Header

3、Gzip Components

4、Minify JavaScript and CSS

5、Configure ETags

6、Keep Components under 25K

下面兩幅圖分別是啟用Minify之前和啟用Minify之后網(wǎng)站請求時間的一個對比，可以看出啟用Minify之后，資源的加載時間從250ms減少到了125ms，總共節(jié)省了50%的時間。

特性：

合并多個CSS或JavaScript文件為一個文件，減少請求數(shù)量，并且進行minify處理

使用了多個開源的庫，包括 JSMin.php ，Minify CSS，Minify HTML

服務(wù)端緩存（fils/APC/Memcache），可以避免不必要的重復(fù)處理

當(dāng)瀏覽器存在資源的緩存，返回HTTP 304 Not Modified

多個文件合并時，自動生成URI

當(dāng)開啟服務(wù)端緩存的時候，在一般的服務(wù)器上Minify每秒可以處理幾百個并發(fā)請求

根據(jù)請求頭，開啟Content-Encoding： gzip。在服務(wù)端緩存開啟的情況下，Minify提供gzipped 文件速度比Apache’s mod_deflate模塊要快

安裝

下載最新的Minify，然后解壓文件到”min” 文件夾

Copy “min” 文件夾到自己網(wǎng)站的DOCUMENT_ROOT下，如果想要Minify在子目錄下工作，看這里

使用

假設(shè)網(wǎng)站域名是http://example.com，Minify安裝在了虛擬主機的根目錄下，那么訪問http://example.com/min/，我們會看到一個“Minify URI Builder”，我們可以輸入需要進行合并的文件URI，如下

點擊Update之后，系統(tǒng)會自動生成一個合并后的URI：/min/?b=js&f=jquery-a.js,jquery-b.js,jquery-c.js。如果覺得URI太長，可以通過配置文件來指定group，編輯min目錄下的groupsConfig.php文件，加入以下內(nèi)容：

return array(
js => array(//js/jquery-a.js, //js/jquery-b.js, //js/jquery-c.js),//相對于DOCUMENT_ROOT
);    

之后就可以通過/min/?g=js來訪問了

Minify在資源首次被請求的時候，會對多個文件進行合并，gzip，去除空格，注釋等處理，然后會把處理的結(jié)果進行緩存，默認情況下是進行文件緩存，緩存的key以minify_開頭，修改min/config.php文件，配置緩存文件存放的位置：

除了通過文件進行緩存之外，Minify還支持Memcache緩存，修改min/index.php文件，加入以下代碼：

require lib/Minify/Cache/Memcache.php;
= new Memcache;
->connect(localhost, 11211);
= new Minify_Cache_Memcache();    

Minify支持兩種debug方式，一種是通過firephp調(diào)試PHP錯誤，修改min/config.php文件，加入以下代碼：

另一種是通過在URL中加入flag進行錯誤調(diào)試，在min/config.php中加入

之后就能以方式進行調(diào)試了