Compress website js and CSS files using PHP's gzip compression to speed up website access

Now a large number of Web 2.0 sites in order to pursue the user experience, will be a lot of CSS and JS files. This leads to slower concurrent access for multiple users under certain server bandwidth conditions. How to speed up Web page response? This article is mainly about using PHP to compress JS and CSS methods, where the assumption is that the server only supports gzip compression, does not support. htaccess (according to the actual situation of many stationmaster's rented virtual host).

First of all, the CSS and JS files to optimize the performance of a few tips:

(1) Merging multiple CSS/JS documents into one file to reduce HTTP requests

(2) Document compression of the merged files, for example, using JS compressor and CSS Compress

(3) If you use some mainstream JavaScript frameworks, such as jquery, MooTools or Yui, it is highly recommended to use the Google AJAX Library as an external link to import the base library directly. Finally, as mentioned in this article, use gzip to compress the JS/CSS document on the server side. In fact, the use of gzip compression with PHP is very simple, its core is to use Ob_gzhandler, but it is important to note that not all browsers support gzip transfer to the client's data, so a certain degree of fault-tolerant processing.

Here is an example of using PHP to compress CSS through gzip.

Create a new style.php file in the folder where you placed the CSS, adding the following code to the file:

  
   if (extension_loaded (' zlib ')) {//Check whether the server is open for zlib expansion
Ob_start (' Ob_gzhandler ');
}
Header (' content-type:text/css; Charset:utf-8 ');//Note Change to your code
Header (' cache-control:must-revalidate ');
$offset = the distance from the 24;//css file is now the expiration time, which is set to one day
$expire = ' Expires: '. Gmdate (' d, D M Y h:i:s ', time () + $offset). ' GMT ';
Header ($expire);
Ob_start (' compress ');
function Compress ($buffer) {//Remove comments from File
$buffer = Preg_replace ('!/\*[^*]*\*+ ([^/][^*]*\*+) */! ', ' ', $buffer);
return $buffer;
}
Contains all of your CSS documents
Include (' global.css ');
Include (' layout.css ');
if (extension_loaded (' zlib ')) {
Ob_end_flush ();//output buffer in the content, that is, the compressed CSS file
}
?>

If you are working with a JavaScript file, you need to change the content-type of line 5th in the above code to the following:

Header (' Content-type:application/x-javascript; Charset:utf-8 ');

After the modification is completed, introduce the relevant required CSS files, and then replace the original HTML into CSS with the following introduction:

The same way JS is introduced as follows:

Because the expires (out-of-date) property used in the code above is used to cache the CSS/JS code on the client, if the expiration time is set too long (for example, one year), the client may not take effect immediately when you modify the JS/CSS code on the server side.

The workaround is to add a random parameter to the PHP file, such as the v=121 in the example above, and when the file is modified the next time, remember to modify this random parameter (for example, 122).

