JavaScriptをコンパクト化

JavaScriptをコンパクト化してファイルサイズを小さくします。

JavaScriptをコンパクト化してファイルサイズを小さくします。ダウンロード速度の高速化に。難読化とは違います。ウェブ屋さんアイテム。

JavaScriptをコンパクト化

使い方はとってもシンプル。JavaScriptをペーストして変換するだけ。完全無料、フリーです。
業務で使える。ウェブ屋さんの便利アイテム。

入力: JavaScriptコードを貼り付け

JavaScriptをコンパクト化します。このサイトでのコンパクト化とは、コメントと削除可能な空白及び改行文字を取り除くことを言います。
コメントや空白や改行を取り除くことで、ファイルサイズを抑える事が可能となり、つまりリクエストに対するデータ転送速度向上を見込めます。
難読化とは異なり、変数や関数名を短くするなどの処理は行っていません。
難読化ではありませんが、適度なネスティングが無いとコードが読めませんので、ダウンロードした人は解析を早々に断念する確率が上がるかも知れません。
コンパクト後のJavaScriptが動作しない、または、エラーが出る場合:
変換前のコードでセミコロンが不足している事が考えられます。

変換前の例)
var aaa = 10
function bbb() {
}
このコードは通常問題無く動作します。ただし、aaa = 10の後ろにセミコロンが無いのは正しいシンタックスに反しています。
このコードをコンパクト化すると、
var aaa=10function bbb(){}
となってしまいます。

正しい例)
var aaa = 10;
function bbb() {
}
正しい例のコンパクト化)
var aaa=10;function bbb(){}
さらにファイルサイズを抑えるにはgzip圧縮する事で、サイズを大幅に小さくできる事でしょう。
gzip圧縮した場合は、リクエストヘッダのAccept-Encoding参照によって対応していないリクエストには無圧縮データを送る必要が有りますので、そのあたりは.htaccessでrewriteで設定可能です。
例としてはこんな感じになるでしょうか。

RewriteEngine On
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{REQUEST_FILENAME} "\.js$"
RewriteRule .+ %{REQUEST_URI}.gz

<FilesMatch "\.js\.gz$">
  ForceType text/javascript
  AddEncoding x-gzip .gz
</FilesMatch>

ウェブサイトでFlashを使用する頻度が極端に無くなった昨今、JavaScriptの需要は益々増えており、JavaScriptのファイルサイズもばかにならなくなってきました。
CSSファイルもCSS3の規格が浸透するにつれて肥大化してきています。
インターネット内の全サイトがコンパクト化されればかなりの省エネルギー化と時間節約、ローコスト化になるのではないかと思います。
サイトの品質とは応答速度も大きな要素です。プロのウェブ屋さんならば100msの時間短縮に喜びを感じてみてはいかがでしょうか。
JavaScriptについて:
JavaScriptは近年まで各種ウェブブラウザでの実装がまちまちで、独自仕様も多く存在していました。あるベンダーが新仕様を実装すれば別のベンダーがそれに追従する形で様々な機能が付加されてきた経緯が有ります。
完全に独自仕様と言う物も存在し、JavaScriptでの記述にはそのブラウザの違いを把握してどのブラウザでも動作するまたは代替表示するように工夫されてきました。1つの機能を実現する為に様々な記述が必要となり、JavaScriptでのプログラミングを難解なものとしてきました。
これまでのHTML4.01とは異なり、HTML5では独自実装を競うのではなく、W3C(World Wide Webコンソーシアム)が仕様の取り決めを行っている業界標準となります。
HTML5にはJavaScriptの仕様も含まれ、今までの様にクロスブラウザ対策を必要とせず仕様通りの書き方が出来ます。ただし完全に勧告されるのは2014年となっており、ドラフト段階で各ブラウザベンダーは実装を行っていますが、まだまだ全ては追いついていないのが現状です。
完全に実装が完了したとしても、それは最新ブラウザだけと言う事であり古いブラウザは対応していないままです。よって、まだまだクロスブラウザ対策と言うのはしばらく続きます。
しかし、多くのウェブサービスやウェブサイトでは古いブラウザは切り捨てる様になってきました。アクセスすると「お使いのブラウザでは全ての機能をお使い頂けません」等のメッセージが表示されます。
AdobeがFlashのモバイル版開発を断念した理由の一つにモバイル端末はデスクトップパソコンに比べて総合性能が低く、Flashの全ての機能を表現できないという事が有ります。そういったこともあって、HTML5だけでのグラフィック表現はますます注目される事となってきました。
2013年5月初版
2024年10月改訂
このサイトについてのお問い合わせはエーオーシステムまでお願いいたします。
ご使用上の過失の有無を問わず、本プログラムの運用において発生した損害に対するいかなる請求があったとしても、その責任を負うものではありません。