How to Compress Javascript File Using PHP

Previously we have discussed how to compress javascript files using YUICompressor, Closure Compiler, and UglifyJs, now we will discuss how to compress javascript file using PHP.All he above compressors have very good compression

All of the above compressors have very good compression level, but the main limitation is that we have to run it using command prompt.

So, to use that compressor within PHP environment, we need to use exec statement that needs access rights to the command prompt, so if we don’t have it, we can use this alternative.

PHP Library for Compress Javascript File

There are several PHP Library or classes that can be used to compress javascript file, but most of them don’t have a feature to obfuscate / mangle the code, it only removes comments, spaces, line break, etc, so the resulted file size is not at best.

One of them that has the feature to mangle a javascript code is JS Squeze, but the result is not 100% safe, the compressed file is broken, we’ll discuss it later.

Regardless of the existing weaknesses, let’s discuss some popular PHP library that can be used to compress javascript file

I. Compress Javascript File Using Matthis Mullie Minify

This compressor developed by Matthias Mullie and is still actively developed to date, also it has a pretty good compression results too. To use it, follow the following steps:

  1. Create a working folder inside htdocs directory, for example: I create a folder named minifier.
  2. Install the library. Installation can be done automatically using composer, if you don’t use composer, you can download it manually through it’s Github page

    Download Matthias Mulie - PHP Minify From Github

  3. Next, extract the files to the directory that we have been created earlier, note that the data and src folder must be located in the same directory. In this example, I put it in the htdocs/minifier folder

    Directory Structure

  4. Placed the javascript files that we want to compress to that directory (minifier), for example I use the jquery-1.12.4.js file. Open your code editor,  then put the following code:
    $path = 'src';
    require_once $path . '/minify/src/Minify.php';
    require_once $path . '/minify/src/JS.php';
    require_once $path . '/minify/src/Exception.php';
    
    use MatthiasMullie\Minify;
    $minifier = new Minify\JS('jquery-1.12.4.js');
    $minifier->minify('jquery-1.12.4.min.js');

    Save the code as php file e.g. minify_javascript.php and dont’t forget to place it to the directory that we created earlier (minifier).

  5. Run the file using your browser (http://localhost/minifier/minify_javascript.php), the result looks like the following figure:

    Compress Javascript File Using PHP Minify

    The file size is reduced by 48.8%

II. Compress Javascript File Using PHP – JS Shrink

The second library that we can use is JShrink. Until this article was written, the latest commit was on June 4, 2015, almost a year, fairly updated.

This library contains only a single php file, however, it does the job well, the compressed code is working and compressed file size is decent. To use it follow the following steps:

  1. Download Minifier.php file from Github and copy it into the src directory (htdocs\minifier\src).
  2. Copy the javascript files we want to compress into minifier folder, for example, I’ll use the jquery-1.12.4.js as in the previous example.
  3. Open your code editor, eg notepad++, then copy paste the following code:
    include('src\jsshrink.php');
    
    $jsCode = file_get_contents('jquery-1.12.4.js');
    $minifiedCode = \JShrink\Minifier::minify($jsCode, array('flaggedComments' => false));
    file_put_contents('jquery-1.12.4.min.js', $minifiedCode);

    Save as .php file (e.g: minify_jsshrink.php) and place it into minifier directory.

  4. Run the php file in a browser (http://localhost/minifier/minify_jsshrink.php). The result is:

    Compress Javascript File Using PHP - JSShrink

    The file size is reduced by 48.1%, but it 2kb larger than the previous compressor.

III. Compress Javascript File Using PHP – JSQueeze

The third library that we can use is JSQueezee. This library is also just a single php file and is still actively developed.

Unlike previously, this library is able to obfuscate / mangle the javascript code so that the resulting file is much more compact. However, as mentioned earlier, this library is not 100% safe. Let’s try:

  1. Download jssqueeze.php file from Github then copy it into the src directory (htdocs\minifier\src)
  2. As in the previous example, place the jquery-1.12.4.js file into minifier directory.
  3. Open your code editor, e.g: notepad ++ and put the following code:
    $jz 		= new JSqueeze();
    $jsCode 	= file_get_contents('jquery-1.12.4.js');
    $minifiedJs = $jz->squeeze(
        $jsCode,
        true,   // $singleLine
        false,  // $keepImportantComments
        false   // $specialVarRx
    );
    file_put_contents('jquery-1.12.4.min.js', $minifiedJs);

    Save as .php file (e.g: minify_jssqueeze.php) and place it in the minifier directory.

  4. Open a browser and run that file (http://localhost/minifier/minify_jsqueeze.php). The result is:

    Compress Javascript FIle Using PHP - JSQueeze

    Wow, the file size is reduced by 65.2%, much more compact than the previous. BUT as stated before, this result is not 100% safe, let’s test it

Test whether the compressed file is working

If you use javascript compressor that has a mangle or obfuscate feature (the file size decreased significantly), then consider to make sure that the compressed files work well.

Simple test

To perform the test, simply create a.html file, for example test_compression.html, and then put the following simple code:

<!DOCTYPE HTML>
<html>
<head>
	<title>Test The JSQueeze's Compressed Code</title>
	<script src="jquery-1.12.4.min.js"></script>
</head>
<body>
	Test The JSQueeze's Compressed Code
</body>
</html>

Save the file in the minifier directory, then run in a browser, e.g: chrome. Next, open the browser’s Developer Tools then navigate to the Console section, check whether the error message appears.

Compressing Result Test Using Chrome

From the figure above, we know that the javascript code is broken . This may be because of the javascript code is too complex for the compressor

However, this compressor can still be used as we only tested it on a single javascript file and accidentally, the resulted code was broken. You can make an experiment by trying another file or report the bugs to the author.

Other Library…

There is another PHP library that can be used to compress javascript file, that is: Mrclay Minify. This library is also actively developed and has so many useful features including merging javascript files.

But like the others, this library only removes comments, spaces, line breaks, and other characters that are not needed, so the resulted file size is the same.

Subscibe Now

Loves articles on webdevzoom.com? join our newsletter to get quality article right to your inbox. Nothing else, just quality stuff!!!

Related Post

Leave a comment

Like Us

Newsletter

Great information from webdevzoom.com right to your inbox

We value your privacy

Social