ミニファイ

コンピューターサイエンスでは、ミニファイとは、不要な要素を削除し、ファイルサイズを小さくするためにコードを書き換える処理です。 これは通常、HTML、CSS、JavaScriptファイルなどのWebページのリソースに対して行われます。 Webリソースのサイズを小さくすると、ファイルをより速く転送できるため、Webページの読み込みも速くなります。

データをミニファイする方法はいくつかあります。 最も基本的な方法は、コメント、不要な空白、改行(改行文字）を削除することです。 コメントや空白はコードを読みやすくするのに役立ちますが、ブラウザーでは無視されます。 そのため、公開する前にこれらの要素を安全に削除できます。 別の方法は、各文に必要なコードを最小限にすることです。 CSSでは、長形式のCSSを短形式のCSSに変換することで実現することがよくあります。 たとえば、marginの定義は長形式では7行になることがありますが、短形式では1行だけになります。 JavaScriptでは、長い変数名を、より短い名前多くの場合は1つの(文字）に置き換えることができます。

以下は、ミニファイ前とミニファイ後のCSSコードの例です。 コメント、空白、改行、不要なセミコロンが削除されていることに注目してください。 コードは長形式のCSSから短形式にも変換されています。

標準的なCSSコード

img.left   /* 左寄せの400px画像 */
{
    float: left;
    max-width: 400px;
    margin-top: 8px;
    margin-right: 30px;
    margin-bottom: 12px;
    margin-left: 0px;
}

ミニファイ後のCSSコード

img.left{float:left;max-width:400px;margin:8px 30px 12px 0}

高度なミニファイアルゴリズムを使うと、ファイルサイズをさらに小さくできます。 たとえば、CSSミニファイツールはCSSファイル内の重複する行を見つけて削除できます。 また、似たCSS定義を1つの文にまとめることもできます。 JSミニファイツールは、JavaScriptの関数を書き換えて、より効率的にすることもあります。

コードをミニファイしても、数キロバイトしか節約できないことがよくあります。 たとえば、標準的なCSSファイルが50KBで、ミニファイ後のバージョンが40KBになる場合があります。 しかし、ページの読み込み速度を改善するときは、1キロバイトも無駄にはできません。 優れたミニファイツールの目標は、コードの解析方法や処理方法にまったく影響を与えずに、ファイルサイズをできるだけ小さくすることです。 どのミニファイツールを使う場合でも、開発者は通常、将来編集できるように、ミニファイしていないバージョンのコードを保持します。

ミニファイと圧縮の違い

ミニファイとファイル圧縮はどちらもファイルサイズを小さくしますが、同じものではありません。 ミニファイは単にテキストを変更しますが、ファイル圧縮はファイル内のバイナリコードを完全に書き換えます。 圧縮されたファイルをテキストファイルとして読み取るには、ファイル解凍ユーティリティで解凍する必要があります。 多くのWebサイトでは、Webリソースのサイズをできるだけ小さくするために、ミニファイと「gzip」ファイル圧縮を組み合わせて使用しています。