Minify Optimization site: merge multiple css or JS files

Article Introduction: use Minify to optimize the performance of the site to merge multiple CSS or JS files.

Minify is the use of PHP5 development, by following some of Yahoo's optimization rules to improve the performance of the site. It merges multiple CSS or JavaScript files, removes unnecessary spaces and annotations, makes gzip compression, and sets the browser's cache head. Minify is very similar in design to Yahoo's Combo Handler service, but minify can merge any JavaScript and CSS files you want to merge.

Under normal circumstances, the site speed bottlenecks are in the front-end, and the most critical is the speed of the loading of resources, but most browsers have a single domain name concurrent request limit, so if a page has a lot of resources, such as CSS and JavaScript files, it will obviously reduce the load speed of the site, The better way to deal with it is to access multiple files through a single request, which will not affect the maintenance of the file before, but also reduce the clear number of resources, Minify is to be born. Here are some of the Yahoo! used by minify Optimization criteria:

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

The following two diagrams, respectively, are a comparison of the Web site request time before enabling minify and enabling Minify, and you can see that when Minify is enabled, the load time of the resource is reduced from 250ms to 125ms, saving a total of 50% of the time.

Characteristics:

Merge multiple CSS or JavaScript files as a file, reduce the number of requests, and perform minify processing

Uses multiple open source libraries, including jsmin.php, Minify css,minify HTML

Server-Side Caching (Fils/apc/memcache) to avoid unnecessary duplication

Returns HTTP 304 not Modified when the browser has a cache of resources

Automatically generate URIs when multiple files are merged

When server-side caching is turned on, Minify can handle up to hundreds of concurrent requests per second on the regular servers

According to the request header, open the Content-encoding:gzip. With server-side caching turned on, Minify provides gzipped files faster than Apache ' s mod_deflate modules

Installation

Download the latest minify and unzip the files to the Min folder

Copy "min" folder to your own site under the Document_root, if you want to minify work in subdirectories, look here

Use

If the site domain name is http://example.com,Minify installed in the root directory of the virtual host, then access to http://example.com/min/, we will see a "minify URI Builder", We can enter the file URI that needs to be merged, as follows

After clicking Update, the system will automatically generate a merged uri:/min/?b=js&f=jquery-a.js,jquery-b.js,jquery-c.js. If you think the URI is too long, you can specify group by configuration file, edit the groupsconfig.php file in the Min directory, and add the following:

Return Array ( "JS" => Array ("//js/jquery-a.js", "//js/jquery-b.js", "//js/jquery-c.js"),//relative to Document_root );

Then you can access it through/MIN/?G=JS.

Minify when the resource is first requested, will merge multiple files, gzip, remove spaces, annotations, and so on processing, and then the processing of the results are cached, by default is the file cache, the cache key to Minify_ beginning, modify min/ config.php files, where the cache files are stored:

$min _cachepath = "/tmp";

In addition to caching through files, Minify also supports memcache caching, modifies min/index.php files, and adds the following code:

Require "lib/minify/cache/memcache.php"; $memcache = new Memcache; $memcache->connect ("localhost", 11211); $min _cachepath = new Minify_cache_memcache ($memcache);

Minify supports two types of debug methods, one is to debug the PHP error by firephp, modify the min/config.php file, add the following code:

$min _errorlogger = true;

The other is error debugging by adding flag to the URL, adding the min/config.php

$min _allowdebugflag = true;

Then you can debug it in a http://example.com/min/f=jquery-a.js,jquery-b.js,jquery-c.js&debug=1 way.

Reference:

Http://code.google.com/p/minify/wiki/UserGuide

http://www.mrclay.org/2008/09/19/minify-21-on-mrclayorg/

Article Source: http://weizhifeng.net/2011/04/30/performance-optimization-using-minify/