web-dev-qa-db-ja.com

JavaScriptライブラリを最小化および圧縮するために何を使用しますか？

JavaScriptライブラリを最小化および圧縮するために何を使用しますか？

javascriptcompressionminimizejscompress
54
flybywire

YUI Compressor を使用します。仕事がうまくいくようです！

33
jonstjohn

私は YUI Compressor を長い間使用してきましたが、問題はありませんでしたが、最近 Google Closure Compiler を使用して、ある程度の成功を収めました。これまでの私の印象：

  • 一般に、ファイルサイズの縮小の点でYUI Compressorよりも優れています。シンプルモードでは少量、アドバンスモードでは多く。
  • シンプルモードは、これまでのところ、YUI Compressorと同じくらい信頼できます。私がそれを与えた何も問題を示していません。
  • 高度な「コンパイル」モードは一部のスクリプトに最適ですが、スクリプトの劇的なサイズ削減は、それを壊す可能性が高い、コードをいじくり回すことを犠牲にして行われます。 これらの問題のいくつかに対処する方法 があり、それが何をしているかを理解することは問題を回避するのに大いに役立ちますが、通常はこのモードの使用を避けます。

単純な「コンパイル」モードでのGoogle Closure Compilerの使用に移りました。これは、一般的にYUI Compressorよりもわずかに優れているためです。私はYUI Compressorを使用するよりもかなり使用量が少ないですが、これまで見てきたことから、私はそれをお勧めします。

私がまだ試していないが有望に思えるもう1つは Mihai BazonのUglifyJS です。

42
Tim Down

ここに可能性の群れがあります：

私の個人的な経験から、Dojo SDKを使用してカスタムビルドをビルドすることをお勧めします。カスタムビルドは、通常のShrinkSafeコンパイラまたはGoogle Closure を使用するように構成できます。同様にサポート 。

圧縮に関しては、Google Closureがこれまでのところ最良の結果をもたらしていると思いますが、通常はShrinkSafeに満足しており、少し古くて堅牢ですが、Closure Compilerは少し新しいブロックに見えます（たとえば、利害関係者はあまり好きではないかもしれません）。

しかし、YUI Compressorだけで誓う人もいます。私は個人的にそれを保証することはできません。

あなたが自分のJavaScriptコードだけでなく、ライブラリを圧縮することである場合は、これらのツールのほとんどに必要になるため、明らかにもっと複雑になります名前を変更したり削除したりしてはいけないシンボルをエクスポートします。ほとんどのまともなコンプレッサーは、使用されていないと思われる関数を削除します-多くの場合、プロジェクトにバインドされていない場合、ライブラリーの場合は明らかに-名前を変更して短くし、文字数を減らします-また、明らかにパブリックが必要な問題改ざんされないAPI。

このトピックに関する他のスレッドや、ツールのサポートドキュメントで情報を見つけることができます。 Dojoのビルドツール（ShrinkSafeまたはClosure Compilerを使用）のExtJS（YUIコンプレッサーを使用）の一種のペンダントである JSBuilder2 もご覧ください。

（申し訳ありませんが、SOユーザーの場合、複数のリンクを追加できないため、ツールに直接リンクできません。）

編集：圧縮によってバグが発生する可能性があり、コードが壊れていないためデバッグが容易になるといういくつかの回答で表明された懸念に関して：はい、それは有効な懸念です。しかしながら：

  • ミニファイアを使用すると、gzip圧縮がアクティブになっていても、帯域幅の点で非常に大きな改善が得られます（そして、コンプレッサーの寿命を延ばすことにより、gzip圧縮を活用する方法を学ぶことができます。
  • 動作が同じであることを確認するには、デバッグモードとプロダクションモードでコードを試してみてください。つまり、それはあなたの仕事の一部でもあります...
  • これらのコンプレッサーのいくつかはしばらく前から存在しており、実際にコードにバグをもたらすことはありません。彼らは本当に、単に物事を再編成し、文字列を置き換えているだけです。
  • 一部のコンプレッサー（たとえば、dojoビルドシステム）には、圧縮された出力と非圧縮の出力の両方を生成できるオプションが付属しているため、たとえばクエリパラメーターを使用して、デバッグと生成のさまざまなモードを有効にできます。
22
haylem

JavaScriptは最小限に抑えていません。gzip圧縮で十分であり、エラーメッセージが引き続き役立つという利点もあります。

12
Christoph

私もYUI Compressorを使用しています。私は自分のプロジェクトで使用するこのようなantタスクを持っています：

<!--
YUI Compressor tasks 
http://www.julienlecomte.net/yuicompressor/README
-->
<property name="yuicompressor.jar"
           value="C:/devlibs/yuicompressor-2.2.4/build/yuicompressor-2.2.4.jar"/>

<target name="js.compress">
    <!-- Create min directory under js direcrtory if it doesnt exist -->
    <mkdir dir="${js-directory}/min" />

    <apply verbose="true" executable="Java" parallel="false" failonerror="true">
        <fileset dir="${js-directory}" includes="*.js"/>
        <arg line="-jar"/>
        <arg path="${yuicompressor.jar}"/>
        <srcfile/>
        <arg line="-o"/>
        <mapper type="glob" from="*.js" to="${js-directory}/min/*-min.js"/>
        <targetfile/>
    </apply>
</target>
11
kosoant

Dean Edward's packer は、かなり良い圧縮率を実現します。コマンドラインの実装により、継続的な統合プロセスで使用できます。

5
Darin Dimitrov

UglifyJSは新しいものです。

UglifyJSはYUI Compressorよりも優れており、Google Closure Compilerとほぼ同等です。たとえば、Google Closure CompilerからのjQueryの圧縮バージョンは、UglifyJSによって生成されたバージョンよりも403バイトだけ小さい-印象的です！ UglifyJSは、ロングショットで最も速く、クロージャーを6秒以上も上回っています。

さらに、UglifyJSによって生成されるコードは、Closureが生成するコードよりも安全です。たとえば、クロージャはevalや{}を処理する方法を認識していません。エラーを記録し、変数の名前を変更し続けます。これは明らかに、壊れたコードにつながります。 UglifyJSにはこの問題はありません。

詳細はここにあります： http://badassjs.com/post/971960912/uglifyjs-a-fast-new-javascript-compressor-for-node-js

5
Louis

Googleの 閉鎖 ツール

アドオンを使用してFirebugでデバッグするために、縮小版を通常のソースコードにマップできます。

4
epascarello

プロジェクトをビルドするときにVisual Studioに統合してファイルを自動的に縮小できるMicrosoftのソリューションを次に示します。

インストールするには：

以下からmsiをダウンロードします http://aspnet.codeplex.com/releases/view/40584

終了後にコンピュータを再起動する必要がある場合があります。

使用するには：

.csprojファイルを編集し、ファイルの最後（ただし</Project>タグの前）に以下を含めます。

<Import Project="$(MSBuildExtensionsPath)\Microsoft\MicrosoftAjax\ajaxmin.tasks" />

<Target Name="AfterBuild">
    <ItemGroup>
        <JS Include="**\*.js" Exclude="**\*.min.js;Scripts\*.js" />
        <CSS Include="**\*.css" Exclude="**\*.min.css" />
    </ItemGroup>
    <AjaxMin 
    JsSourceFiles="@(JS)"
    JsSourceExtensionPattern="\.js$"
    JsTargetExtension=".min.js"
    CssSourceFiles="@(CSS)"
    CssSourceExtensionPattern="\.css$"
    CssTargetExtension=".min.css"/>
</Target>

プロジェクトをビルドすると、末尾が.min.js、.min.cssでないすべてのCSSファイルとjsファイルが縮小されます（他のファイルを縮小から除外するには、「除外」属性を参照してください）。

3
Brandon Boone

以前にYUIコンプレッサーを試しましたが、エラーメッセージが表示されます。

JSMINを使用してJavaScriptを縮小することをお勧めします。

http://www.crockford.com/javascript/jsmin.html

3
Billy

http://code.google.com/p/jsmin-php/

古き良きDoug Crockford :-)これの美しさは、キャッシュ制御を使用すると、必要なときにだけ、魅力的な自動圧縮を取得できることです。または、私のプロジェクトの1つで、圧縮/ gzip圧縮されたファイルを出力し、変更を加えたら削除します。開発環境では、縮小スクリプトを呼び出さないだけです。

1
Alex

PerlのJavaScript :: Minifierを使用しています。それはかなりうまくいき、あなたは例えばPerlを使用して一部のフレーズを置き換えます。

0
Flo Edelmann

非常に優れたオンラインコンプレッサーがあります。

http://javascriptcompressor.com/

さらに圧縮したい場合は、変数を縮小することもできます。

それが役に立てば幸い

0
greuze

ビルド中にファイルを最小化するためにYUI Compressorを使用する方法を説明した記事を次に示します。 ビルドプロセスの一部としてのJSファイルの圧縮

0
Giorgi

http://caja.appspot.com/tools/index は、HTML/CSS/JSの3つすべてを実行します。

0
Mike Samuel

JavaScript :: Minifier :: XS の周りに単純な（3-4行）ラッパースクリプトを使用しています。

0
user42092

https://jawr.dev.Java.net/ は、縮小化とバージョン管理に最適です

0
Amareswar