Subscribed unsubscribe Subscribe Subscribe

oinume journal

Scratchpad of what I learned

YUI Compressorを使ってWordPressのjsファイルを圧縮する

JavaScript

Webサイト高速化の手法の一つとして、Steve Souders さんが唱えている"Minify JavaScript and CSS" (JavaScriptCSSを圧縮せよ) というのがあります。若干今更感がありますが、ちょっとでも高速化するために、このブログで使用しているiNoveテーマのJSファイルをYUI Compressorを使って圧縮してみました。

 

YUI Compressorのインストール

例によってUbuntu 8.10な環境ですが、YUI CompressorはJava製なのでJDK 6.0を入れます。

 

$ sudo aptitude install sun-java6-jdk

 

終わったらYUI Compressorをダウンロードして解凍します(以後、解凍してできたディレクトリを$YUI_ROOTとします)。

 

WordPressのiNoveテーマで使っているJavaScriptファイルを圧縮

試しにこのブログで使用しているテーマiNoveのJavaScriptYUI Compressorを使って圧縮してみます。

 

$ cd ~/tech/wp-content/themes/inove/js/

$ java -jar $YUI_ROOT/build/yuicompressor-2.4.2.jar menu.js > menu.js.new

 

 

結果は標準出力に書き出されるので、適当に別ファイルにでもリダイレクトします(-o でもOK)。出来上がったファイルのサイズを見てみると、下記のように5.8KBのファイルが4.0KBに減っているのがわかります。(約68%になりました)

 

$ ls -lh menu.js*

-rw-r--r-- 1 kazuhiro kazuhiro 5.8K 2009-02-13 00:21 menu.js

-rw-rw-r-- 1 kazuhiro kazuhiro 4.0K 2009-02-13 00:23 menu.js.new

 

こうやってどんどんファイルを小さくしていけば、クライアントの.jsファイルの取得が速くなるのでサイトの高速化が見込めます。どのぐらい速くなるかはクライアントの海鮮速度に大きく依存するので一概には言えませんが、ガンガン圧縮して試してみると良いと思います。

 

[tmkm-amazon]487311361X[/tmkm-amazon]