2014/06/03

【JavaScript】eclipseのプラグイン『jsLex』を使ったファイルの圧縮方法【CSS】

【JavaScript】eclipseのプラグイン『jsLex』を使ったファイルの圧縮方法【CSS】

Webサイトの表示速度をアップさせる方法の一つとして,ファイルの軽量化があります.

今回は,eclipseのプラグイン『jsLex』を使用して,ファイルを圧縮する方法を紹介します.

目次

プラグインのインストール方法

まず,メニュー内のヘルプからEclipseマーケットプレースを選択します.

そして,ウインドウ下部にあるMarketplacesから,Yoxos Marketplace - by EclipseSourceを選択します.

次に,ウインドウ上部の検索欄にjsLexと入力し,出てきたRockstar Web Optimizerのインストールボタンをクリックします.

2つの項目にチェックが入っていることを確認後,使用条件の条項に同意を選択し,インストールします.

※インストール中にセキュリティ警告が入りますが,続行をクリックして,インストール作業を進めてください.

インストールが終了すると,eclipseの再起動を求められるので,再起動してください.

ファイルの圧縮方法

ファイルを圧縮するには,圧縮したいファイルを右クリックし,Rockstar AppsからJavaScriptの圧縮を選択してください.

実行結果

圧縮を実行すると以下の様に圧縮したファイルが生成されます.

圧縮結果は以下の様になり,元のファイルの2/3程度まで圧縮されていることが分かります.

ファイル名 ファイルサイズ
script.js 298バイト
script.js.min.js 238バイト
script.js.ycomp.js 202バイト

※今回はJavaScriptファイルの圧縮を例に説明しましたが,同様の方法でCSSファイルの圧縮も行うことが出来ます.

まとめ

このプラグインを使用することで,簡単にファイルを圧縮する事ができます.

ソースコードの難読化にもなるので,是非使ってみてください.