Home > Javascript AJAX CSS | Javascript Compressor > Javascript Compressor (Google Gadget)

Javascript Compressor (Google Gadget)

Posted by: WebMaster
2008年9月10日 10:42
Javascript AJAX CSS | Javascript Compressor

改良版のJavascript Compressor のソースコードです。 http://www.samurai-logic.com/mt/2008/09/javascript-compressor-modified.html

ガジェットの貼り付けコード

IE でガジェットが表示されないバグがありましたのでcontent type を html→url にしました。
javascript compressorのソースコードは記事の最後に紹介しています。

使い方：
上に、data1, data2, data3, output の４つタブがあります。data1からdata3のテキストエリアにJavaScriptのソースコードをコピー&ペーストします。

(1) Strip Tag はHTMLのタグを削除します。

(2) Escape HTMLは> < & " ' を> < & " 'に変換します。

(3) Unescape HTMLは> < & " ' を > < & " ' に変換します。

(4) Strip Commentsはスクリプトのコメントを削除します。コメントとソースコードが重なっていないかなどのチェックに使えます。

(5) Compress Javascriptはスクリプトを圧縮します。

実行ボタン(Execute)を押せば、結果がoutput タブのテキストエリアに表示されます。

圧縮するコードのサイズが大きければ、Google Chrome または Safari を使ってください。

テストした Javascript ファイル	YUI menu.js(217KB=>73KB) YUI animation.js(48KB->14KB) YUI container_core.js(137KB->44KB)	圧縮ファイルを使ったページ

Javascript Compressor 使用上の注意:
コードの行終わりには必ず「；」が書かれていることを確認してください。

例：
function code(){ var count = 0 var temp = 10 return count+temp }
上のコードの終わりに count=0; と"；"がありませんが圧縮前は正常に動きます。
しかし圧縮後は

function code(){var count=0 var temp=10 return count+temp}

となりエラーになります。

このプログラムはJavascript でdata タブのテキストエリアに貼り付けられたスクリプトを圧縮するので、Javascript の処理速度が生命線になります。ある程度大きなコードの圧縮もガジェットレベルで簡単に出来るようになるようなものを想定してます。コードも効率的でスピードを最も重視して書いています。

Pentium 3GHz (CPU)以上で、メモリに余裕があれば、かなり大きなサイズのJavascript ファイルもGoogle Chromeの高速Javascript engine 搭載のブラウザで実行すれば1秒程で圧縮されます(個人所有のPC１台でしか使ってませんので、誤差があるかと思います)。 Javascriptの処理速度の遅いブラウザでの大きなサイズのファイル圧縮は時間がかかります。

Google Gadget : Javascript compressor のfunction のソースコードです。

括弧をカウントして書き忘れがないか簡単なエラーチェック機能を装備してます。コメントを削除のみもできますのでコメントの囲い(　/* ～～～ */　)　がコードに重なっていないかのチェックも出来ます。

圧縮されるコードを最初の文字からチェックしながら１周で終わりますので高速です。もう少し、簡略化できそうですが、とりあえず紹介しておきます。

正規表現の部分( / pattern / )でコードがちゃんと書かれていないときや変わった書き方がしてある場合（コード内の正規表現の条件が満たされた場合）エラーになる可能性があります。
例えば、/(\d\s|\s\w|\/g\,\s\w+)/ と書く正規表現の "\,\s" の部分を/(\d\s|\s\w|\/g, \w+)/ と"\," を ","、そして "\s" を "　" と書かれた場合、プログラムが正規表現と判断してしまう部分が /(\d\s|\s\w|\/g, の部分となりますのでスペースを余計な文字とみなして削除されます。それに \w+) の括弧 ")" が余計にカウントされてしまいます。　通常考えられない書き方ですが、この部分はコードの書き方に因ります。

スクリプトのString データを変数 str に格納して$compress(str) を実行したとき圧縮され、$compress(str, false) でコメントのみを削除します。

Modified code 14 Sep. 2008 new improved version will be coming out at end of Sep.
New Source code of Javascript Compressor
http://www.samurai-logic.com/mt/2008/09/javascript-compressor-modified.html

/**********************************************
   9 Sep. 2008 (C)samurai-logic.com
   Modified on  14 Sep. 2008
   Javascript Compressor
**********************************************/
function $compress(str,flag){

if(flag==true) str=str.replace(/\t/g," "); // doesn't take time, but it's not good algorithm

Reg=/([^\d\w]\n[^\d\w]|[^\d\w]\s[^\d\w]|[\d\w]\s[^\d\w\$\_]|[^\d\w]\s[\d\w])/;
Exp=/(\/)(\s*)(g|i|m|y|\,|\;|\.|\n)/; // added \[, \:, \n, and (\s*)
chr=/(\(|\=|\[|\:)/;

bracket=new Array();
bracket[0]=0; bracket[1]=0; bracket[2]=0;

var CODE  = "";  
var cmt   = false;
var arg   = -1;
var pos = end = 0;
var last=" "; // store last char. in CODE

while (pos >= 0){

var key_q = str.charAt(pos);
	var key_c = str.substr(pos,2);
	//var key_r = CODE.charAt(CODE.length-1)+key_c; //<==too much time(it doesn't clear condition of speed)
	var key_r = last + key_c;

if (key_q=="'")	      { arg = 0; pos++; }     //find pos of keyword '
	else if (key_q=='"')  { arg = 1; pos++; }     //find pos of keyword "
	else if ((key_q=='/') && (key_c!="//") && (chr.test(key_r.charAt(0)))) 
			      { arg = 4; pos++; }     //find pos of keyword /
	else if (key_c=="//") { arg = 2; pos+=2; }    //find pos of keyword //
	else if (key_c=="/*") { arg = 3; pos+=2; }    //find pos of keyword /*
	else 		      { arg =-1; pos++; }

if (arg>=0){	//if keyword is found
	   if (arg==0)      { end = str.indexOf("'", pos); }
	   else if (arg==1) { end = str.indexOf('"', pos); }
	   else if (arg==4) { end = str.indexOf("\n", pos); 
			      var temp=str.substring(pos,end)+"\n";
			      end = eval(temp.search(Exp)+pos+1);
		 	    }
	   else if (arg==2) { end = str.indexOf("\n", pos);   pos--; cmt = true; }
	   else /*if(arg==3)*/{ end = str.indexOf("*/", pos); pos--; end++; 
					   if (end == 0) cmt = false; //if not found(avoid error)
					   else		 cmt = true; }
	   if (end <= 0) end=str.length-1;

if (cmt==false) CODE += str.substring(pos-1,end+1);

pos=end+1; cmt=false;  //at last, end up with pos=0

}else{ // else keyword is not found 
 
	    if (flag==true){ if ((!(Reg.test(key_r)))) { CODE += key_q; last=key_q;}}
	    else { CODE+=key_q; last=key_q;}

switch(key_q){
		case "(" : bracket[0]++; break;
		case ")" : bracket[0]--; break;
		case "{" : bracket[1]++; break;
		case "}" : bracket[1]--; break;
		case "[" : bracket[2]++; break;
		case "]" : bracket[2]--; 
	   }  
	    if(pos>=str.length) pos=-1;
	} 
   }
  var hr="\n\n----------------------------\n\nError(bracket is missing) () : ";

if (eval(bracket[0]+bracket[1]+bracket[2])!=0) 
	CODE+=hr+bracket[0]+"; {} :"+bracket[1]+"; [] : "+bracket[2];

delete str; delete Reg; delete bracket;

if (flag==true) CODE=CODE.replace(/^\s+/,"").replace(/\;\}/g,"}");// replace ;} => }

return(CODE);
}

下のコードは、バグが発生したコードです。

found bug in the portion added to the original algorithm. 13 Sep. 2008

rewrote var Reg & var Exp. (11 Sep.)

/**********************************************
  9 Sep. 2008 (C)samurai-logic.com

Javascript Compressor
**********************************************/

function $compress(str,flag){

//------------------------------------------
// 1. check char. and find pos. of five keywords (", ', /*, //, /)
// 2. find the position(var end) of the other by indexOf method
// 3. if not found, add the char. to var CODE if necessary

// str = string to compress or delete comments
// flags = true, compress code
// flags = false, delete comments(not compress)
//--------------------------------------------

Reg=/([^\d\w]\n[^\d\w]|[^\d\w]\s[^\d\w]|[\d\w]\s[^\d\w\$\_]|[^\d\w]\s[\d\w])/;

Reg2=/([\d\w]\s\n)/;  // Reg, Reg2 is condition to strip space

Exp=/(\/)[gimy\,\;\s\.]/i; // pattern of end of regular expression

chr=/(\(|\=)/;   // pattern of the character before regular expression

bracket=new Array();

bracket[0]=0; bracket[1]=0; bracket[2]=0; // bracket count a pair of brackets

var CODE  = "";      //new string for compressed code
var cmt   = false;　 //cmt=true, char is comment.< -- > cmt=false, char is code.
var arg   = -1;         //arg decide the keyword to find
var pos = end = 0;  //pos = postion of open keyword, end = postion of close keyword

while (pos >= 0){

var key_q = str.charAt(pos);     // key_q is to find pos of quot " and ' and /
	var key_c = str.substr(pos,2);   // key_c is to find pos of /* and //
	var key_r = str.substr(pos-1,3); // key_r is to test char is necessary

if (key_q=="'")	      { arg = 0; pos++; }     //find pos of keyword '
	else if (key_q=='"')  { arg = 1; pos++; }     //find pos of keyword "
	else if ((key_q=='/') && (key_c!="//") && (chr.test(key_r.charAt(0)))) 
			      { arg = 4; pos++; }     //find pos of keyword / (RegExp)
	else if (key_c=="//") { arg = 2; pos+=2; }    //find pos of keyword //
	else if (key_c=="/*") { arg = 3; pos+=2; }    //find pos of keyword /*
	else 		      { arg =-1; pos++; }

if (arg>=0){  	//if keyword is found,   end find a pair of key char. "
	   if (arg==0)      { end = str.indexOf("'", pos); }   // find position of " start from pos
	   else if (arg==1) { end = str.indexOf('"', pos); }  // find position of ' start from pos
	   else if (arg==4) { end = str.indexOf("\n", pos);  // find position of \n start from pos
			      var temp=str.substring(pos,end);  //temp is string from pos to end
			      end = temp.search(Exp)+pos+1;  //check temp and find end of RegExp
		 	    }

else if (arg==2) { end = str.indexOf("\n", pos);   pos--; cmt = true; }
	   else	/*if(arg==3)*/{ end = str.indexOf("*/", pos)+1; pos--; //pos-- because 2 char "/*"
					   if (end == 0) cmt = false; //if not found(avoid error)
					   else		 cmt = true; }
	   if (end <= 0) end=str.length-1;

if (cmt==false) CODE += str.substring(pos-1,end+1);// if not comment, add chars to CODE

pos=end+1; cmt=false;  //at last, end up with pos=0

}else{    // else keyword is not found 
 
	    if (flag==true){ if ((!(Reg.test(key_r)) || Reg2.test(key_r))) CODE += key_q;}//test char. and compress CODE
	    else { CODE+=key_q; } // else flags=false

switch(key_q){
		case "(" : bracket[0]++; break;  // when ( is found
		case ")" : bracket[0]--; break;    // when ) is found
		case "{" : bracket[1]++; break;  // when { is found
		case "}" : bracket[1]--; break;    // when } is found
		case "[" : bracket[2]++; break;  // when [ is found
		case "]" : bracket[2]--;              // when ] is found
	   }  
	    if(pos>=str.length) pos=-1;  // condition of loop out
	} 
   }

var hr="\n\n----------------------------\n\nError(bracket is missing) () : ";

if (eval(bracket[0]+bracket[1]+bracket[2])!=0) 
	CODE+=hr+bracket[0]+"; {} :"+bracket[1]+"; [] : "+bracket[2];

delete str; delete Reg; delete bracket;  //delete unnecessary momory

if (flag==true) CODE=CODE.replace(/^\s+/,""); //replace white spaces at the head of code

return(CODE);
}

Comments:0

Amazon.co.jp ウィジェット

Home > Javascript AJAX CSS | Javascript Compressor > Javascript Compressor (Google Gadget)

Return to page top