Google Minify: Remove multi-line comments from your scripts!

Today I have been messing with Google Minify for work, if you have not heard the term “minified” before, or if you have and wondered what it meant, then your probably wondering what it does? In a nutshell, minified code means code which has been stripped of it’s clean, tabbed, readability and crushed up into a jumbled mess (because interpreters don't give a shit about neatness).
This means the file size of the code is now much smaller and as a bonus harder to steal and modify.

Google Code have a project for Minify (http://code.google.com/p/minify/) which does just this, but also combines multiple files and caches the results so websites can keep the source files (un-minified) and then minify will update one nice minified version that the browser will see and love.

I played around with it and was generating minified scripts in minutes! It’s a really excellent tool, however I noticed that the minified files still retained multi-line comments:

/*! jQuery UI - v1.8.21 - 2012-06-05
* https://github.com/jquery/jquery-ui
* Includes: jquery.ui.progressbar.js
* Copyright (c) 2012 AUTHORS.txt; Licensed MIT, GPL */
(function(a,b){a.widget("ui.progressbar",{options:{value:0,max:100},min:0,_create:function(){this.element.addClass("ui-progressbar ui-widget ui-widget-content ui-corner-all").attr({role:"progressbar","aria-valuemin":this.min,"aria-valuemax":this.options.max,"aria-valuenow":this._value()}),this.valueDiv=a("<div class='ui-progressbar-value ui-widget-header ui-corner-left'></div>").appendTo(this.element),this.oldValue=this._value(),this._refreshValue()},destroy:function(){this.element.removeClass("ui-progressbar ui-widget ui-widget-content ui-corner-all").removeAttr("role").removeAttr("aria-valuemin").removeAttr("aria-valuemax").removeAttr("aria-valuenow"),this.valueDiv.remove(),a.Widget.prototype.destroy.apply(this,arguments)},value:function(a){return a===b?this._value():(this._setOption("value",a),this)},_setOption:function(b,c){b==="value"&&(this.options.value=c,this._refreshValue(),this._value()===this.options.max&&this._trigger("complete")),a.Widget.prototype._setOption.apply(this,arguments)},_value:function(){var a=this.options.value;return typeof a!="number"&&(a=0),Math.min(this.options.max,Math.max(this.min,a))},_percentage:function(){return 100*this._value()/this.options.max},_refreshValue:function(){var a=this.value(),b=this._percentage();this.oldValue!==a&&(this.oldValue=a,this._trigger("change")),this.valueDiv.toggle(a>this.min).toggleClass("ui-corner-right",a===this.options.max).width(b.toFixed(0)+"%"),this.element.attr("aria-valuenow",a)}}),a.extend(a.ui.progressbar,{version:"1.8.21"})})(jQuery);;

To me leaving these comments in the files is a waste considering the whole point is to compress everything down. So I decided to modify the code slightly so that it would remove all multi-line comments, follow my instructions below and you too can modify this project and stop multi-line comments beefing up your files.

How-to Guide

First navigate your /min/ folder and find this file:

/min/lib/JSMin.php

Do a CTRL + F and look for:

protected function multipleLineComment()

you will see that this function consists of a while loop that is going over the multi-line comment to check if it’s “preserved by YUI Compressor”, or if the comment contains conditional statements. You want to modify the YUI Preservation part, so look for this if statement:

// if comment preserved by YUI Compressor
if (0 === strpos($comment, '!')) {
 return "\n/*!" . substr($comment, 1) . "*/\n";
}

Comment out the return, and put an empty one like so:

// if comment preserved by YUI Compressor
if (0 === strpos($comment, '!')) {
 //return "\n/*!" . substr($comment, 1) . "*/\n";
 return "\n";
}

I originally tried an empty string, but it grumbled so make sure you put in \n.

Congratulations, now you don't have comments in your minified code!!

Author: Dean WilliamsI'm a Web Developer, Graphics Designer and Gamer, this is my personal site which provides PHP programming advice, hints and tips

Twitter Facebook Linkedin