ImageOptimizer

目次

• はじめに
• 動作条件
• インストール
• 初期設定
• 機能・使い方
• 更新履歴

はじめに

Movable Type で管理・出力される画像データを最適化する機能を追加するプラグインです。主に次のような特徴があります。

1. Movable Type のアセットとして管理されているJPEG形式・PNG形式の画像を最適化することができます。
2. Movable Type から生成されるサムネイル画像も最適化することができます。
3. サムネイル画像生成に、最適化前のオリジナル画像を使用することで、劣化を最小限に抑えたサムネイル生成を行います。
4. 管理画面のアセット一覧から行う方法やアップロードのタイミングで行う方法（アセット）など最適化のタイミングを選ぶことが可能です。

動作条件

本プラグインは Movable Type 7.x にて動作します。
また、最適化にあたって、次のコマンドラインツールが必要となります。

• OptiPNG
• JPEGoptim

※MTクラウド環境では動作しません。

インストール

本パッケージに含まれる「plugins」ディレクトリ内の「ImageOptimizer」ディレクトリを、Movable Typeインストールディレクトリの「plugins」ディレクトリの下にコピーしてください。
次に本パッケージに含まれる「mt-static/plugins」ディレクトリ内の「ImageOptimizer」ディレクトリを、スタティックディレクトリ（環境設定ファイルmt-config.cgiにおいて「StaticWebPath」として指定したディレクトリ）の「plugins」ディレクトリの下にコピーしてください。
次に本パッケージに含まれる「tools」ディレクトリ内のファイルを、Movable Typeインストールディレクトリの「tools」ディレクトリにコピーしてください。

インストール後、以下のような構成になります(一部省略しています)。

    mt (Movable Typeインストールディレクトリ)
   ┗ plugins
       ┣ ImageOptimizer
       ┃┣ extlib
       ┃┃┗ Capture
       ┃┃    ┗ Tiny.pm
       ┃┣ lib
       ┃┃┣ ImageOptimizer
       ┃┃┃┣ Handler
       ┃┃┃┃┣ JPEGoptim.pm
       ┃┃┃┃┗ OptiPNG.pm
       ┃┃┃┃    ┗ PNGQuant.pm
       ┃┃┃┣ L10N
       ┃┃┃┃┗ en_us.pm
       ┃┃┃┃    ┗ ja.pm
       ┃┃┃┣ App.pm
       ┃┃┃┣ CMS.pm
       ┃┃┃┣ Handler.pm
       ┃┃┃┣ L10N.pm
       ┃┃┃┣ Optimizer.pm
       ┃┃┃┗ Task.pm
       ┃┃┃    ┗ Util.pm
       ┃┃┗ ImageOptimizer.pm
       ┃┗ config.yaml
       ┗ tools
           ┗ optimize_images
               ┗ register_image_assets
   ┗mt-static（スタティックディレクトリ）
       ┗ plugins
           ┗ ImageOptimizer
               ┗ docs
                   ┣ image-optimizer.html
                   ┗ mtdocs.css

次に、Movable Type のシステムのプラグイン設定画面を表示し、プラグインの一覧に「ImageOptimizer」が表示されていることを確認してください。これでインストール完了です。

初期設定

本プラグインを使用するためには初期設定が必要となります。初期設定はシステムのプラグイン設定画面から行います。

バックアップ設定

最適化前のオリジナルの画像を退避させるバックアップディレクトリを入力します。
Movable Type から書き込み可能なディレクトリを指定してください。

バックアップ先ディレクトリ

バックアップ先となるディレクトリを指定します。容量に余裕のあるディレクトリを指定するようにしてください。

最適化設定

最適化のタイミングを指定します。Movable Type で管理されるアセット画像と、アセットからMTタグで生成されるサムネイル画像で、異なる最適化タイミングを指定することができます。

アセット最適化

アセット画像は、Movable Type に登録（アップロード）し、IDが付与され、管理画面にて管理される画像です。そのまま表示に使用されるほか、MTAssetThumbnailURLタグ・MTAssetThumbnailLinkタグでサムネイル画像を生成する場合の、元画像として使用されます。
ここでは、アセット画像を最適化するタイミングを指定します。

手動

自動での最適化を行いません。管理画面のアセット一覧画面から選択したアセットを最適化することができます。

アップロード時に最適化

管理画面からアセットを新規にアップロードした際、その場で最適化します。システムの性能やアップロード画像の大きさによって、最適化が失敗したり、タイムアウトしたりする可能性がありますので、システムのリソース状況や運用の方針を確認した上で設定してください。

バックグラウンドで最適化

管理画面からアセットを新規にアップロードした際、最適化のジョブを作成し、スケジュールタスク実行時にバックグラウンドで最適化します。

サムネイルの最適化

サムネイル画像は、Movable Type に登録されている画像（アセット画像）を元画像として、Movable Typeによって生成される縮小画像です。サムネイル画像は、テンプレートのビルド時に環境変数AssetCacheDirで指定されたディレクトリ（デフォルトは「assets_c」）内に生成されます。
ここでは、サムネイル画像を最適化するタイミングを指定します。

手動

自動での最適化を行いません。MTタグを用いて再構築時に最適化することができます。

作成時に最適化

サムネイル画像が作成された際、その場で最適化します。サムネイルのサイズが大きい場合、最適化に時間がかかり、再構築等の速度に影響を与える可能性がありますので、システムのリソース状況や運用の方針を確認した上で設定してください。

バックグラウンドで最適化

サムネイル画像が作成された際、最適化のジョブを作成し、スケジュールタスク実行時にバックグラウンドで最適化します。

JPEGoptim設定

JPEG画像最適化を行うJPEGoptimの起動設定を入力します。
JPEGoptimはデフォルトでは不要なセグメントの削除と圧縮テーブルの最適化によるロスレス(画像の劣化がない)最適化を行いますが、コマンドラインオプションを指定することで画像の劣化を伴った最適化を行うことができ、よりファイルサイズを削減することができます。
そのため、目的に応じてコマンドラインオプションを調整することをお勧めします。

コマンドパス

JPEGoptimへのパスを指定します。初期設定時にJPEGoptimの実行ファイルと思われるファイルが見つかった場合には、初期値として入力されていますので、指定に問題がないか確認した後、設定を保存してください。保存したパスに実行ファイルが存在しない場合にはJPEG画像の最適化は行われません。

コマンドラインオプション

JPEGoptimのコマンドラインオプションを指定します。デフォルトは「--max=90 --strip-all」です。
ここで指定可能なコマンドラインオプションは次の通りです（JPEGoptim バージョン1.4.7時点）

-m<0～100> もしくは --max=<0～100>

画像のクオリティを0～100の整数で指定します。大きい数字ほど高画質での最適化を行いますが、ファイルサイズを削減できない場合があります。（ファイルサイズが大きくなることはありません）
このオプションを指定した場合には、ロスレスでの最適化は無効化されます。

-S<数値 | 1-100%> もしくは --size=<数値 | 1-99%>

目標とする画像サイズをキロバイト数かパーセントにて指定します。キロバイト指定の場合には整数値を指定します。パーセント指定の場合には--size=95%のように1～99の整数の末尾にパーセントを付与して指定します。
このオプションを指定した場合には、ロスレス(画像の劣化を行わない)での最適化は無効化されます。

-s もしくは --strip-all

JPEGファイルを構成しているセグメントデータのうち、画像の表示に必要ではないと判断できるセグメントをすべて削除することでファイルサイズを削減します。

--strip-none

-s, --strip-allと逆の動作となり、セグメントの削除を行いません。

--strip-com

一般的に加工ソフトの名称等が保存されているコメント(COM)セグメントの削除を行います。

--strip-exif

カメラの撮影情報であるExifデータが保存されている(APP1)セグメントの削除を行います。

--strip-iptc

Adobe Photoshopで使用されるリソースデータが保存されている(APP13)セグメントの削除を行います。

--strip-icc

カラーマネジメントに用いるICCプロファイルが保存されている(APP2)セグメントの削除を行います。

--strip-xmp

Adobe社が提唱するカメラの撮影情報のXMLデータが保存されている(APP1)セグメントの削除を行います。

JPEGoptimのコマンドラインの詳細については、開発者のサイト( https://www.kokkonen.net/tjko/projects.html )をご参照ください。

OptiPNG設定

PNG画像最適化を行うOptiPNGの起動設定を入力します。
OptiPNGではカラータイプ・ビット深度の変更、パレット数の削減など画像自体の変更による最適化のほか、圧縮前フィルタの手法と圧縮時のパラメータの組み合わせによる複数パターンでの最適化を試行し、最小のファイルサイズを探します。
そのため最大の効果を求める場合、試行回数が増大するため、比例して最適化にかかる実行時間と、消費メモリが増大する傾向にあります。お使いのサーバーに過剰な負荷を与えないようサーバーリソースに応じてコマンドラインオプションを調整することをお勧めします。

コマンドパス

OptiPNGへのパスを指定します。初期設定時にOptiPNGの実行ファイルと思われるファイルが見つかった場合には、初期値として入力されていますので、指定に問題がないか確認した後、設定を保存してください。保存したパスに実行ファイルが存在しない場合にはPNG画像の最適化は行われません。

コマンドラインオプション

OptiPNGのコマンドラインオプションを指定します。デフォルトは「-o6 -strip all」です。
ここで指定可能なコマンドラインオプションは次の通りです（OptiPNG バージョン0.7.7時点）

-o<0～7>

-f,-zc,-zm,-zsオプションを組み合わせた定義済みの最適化レベルを指定します。大きい数値ほど数多くのパターンでの試行を行うようになっています。

-nb

ビット深度の変更を行いません。

-nc

カラータイプの変更を行いません。

-np

パレット数の削減を行いません。

-nx

すべての削減を行いません。-nb -nc -npと同義です。

-nz

IDATチャンクの再コーディングを行いません。

--strip

画像の表示に不要なメタデータを削除します。現在は--strip allのみ指定可能です。

OptiPNGのコマンドラインの詳細については、公式サイト( http://optipng.sourceforge.net/ )をご参照ください。

MTによる画質自動変更機能の無効化

Movable Type では画像アップロード時に、画像ドライバーによる画質変更を自動的に行う機能がありますが、これが有効になっている場合、画像の再生成が２回行われてしまうため、最適化の効果を十分に得られない可能性があります。
この機能は環境設定ファイル mt-config.cgi に AutoChangeImageQuality 0 を追加するか、管理画面の全般設定画面にて無効化することができます。
本プラグインで画像の最適化を行う場合、最初にこの機能を無効化することを推奨します。

機能・使い方

アセットの管理

アセットの一覧画面から次の機能を実行可能です。

画像最適化

選択したアセットの最適化ジョブを作成することができます。最適化ジョブ作成後に実行されるスケジュールタスクにて最適化が行われます。

最適化前に復元

選択したアセットが最適化済みである場合、バックアップからオリジナル画像に復元し、最適化前の状態に戻すことができます。

また、一覧画面では、最適化済であるか表示・検索することが可能です。

アセットの最適化設定を「アップロード時に最適化」「バックグラウンドで最適化」にしている場合には、アップロードと同時に最適化・最適化ジョブの作成が行われます。
実行結果はシステムのログに出力されます。

サムネイルの最適化

サムネイル画像はMTAssetThumbnailURLタグ・MTAssetThumbnailLinkタグの処理によって生成されます。
サムネイルの最適化設定を「作成時に最適化」「バックグラウンドで最適化」にしている場合には、特にテンプレートの変更なく、サムネイル画像の最適化が行われます。
手動で最適化を行う場合、MTAssetThumbnailURLタグ・MTAssetThumbnailLinkタグにモディファイアの指定を行うことで、特定のサムネイル画像のみ最適化することができます。

タグの使用

MTAssetThumbnailURL / MTAssetThumbnailLink

追加されるモディファイア

opt="0 | 1 | 2"

最適化の方法を指定します

• 0 ... 最適化しません（自動最適化設定より優先されます）
• 1 ... サムネイル作成時に最適化
• 2 ... バックグラウンドで最適化

コマンドラインツールの使用

本プラグインでは２つのコマンドラインツールを提供しています。

optimize_images

指定されたサイトのアセットを一括で最適化します。

-blog_id=サイトID

サイトIDを指定します

-re-optimize

最適化済みのアセットも再度最適化します

-dry-run

ドライラン実行（実際の最適化が行われません。最適化対象となるアセットを確認することができます）

register_image_assets

指定されたサイトのサイトパス以下に存在する画像ファイルのうち、アセット未登録の画像をアセットとして登録します。

-blog_id=サイトID

サイトIDを指定します

-exclude=相対パス

登録対象としないディレクトリを指定します。複数記述することができます。

-dry-run

ドライラン実行（実際の登録が行われません。登録対象となった画像ファイルを確認することができます）

※環境変数AssetCacheDirで指定されたディレクトリ（デフォルトは「assets_c」）内のファイルは無条件で登録除外されます。

更新履歴

• [2022-06-24：v0.24]
• コマンドライン設定のデフォルト値を設定した
• プラグインマニュアルをスタティックディレクトリに配置した
• [2022-06-13：v0.23]
• アセットを削除した場合にバックアップも削除するようにした
• プラグイン設定画面で画像圧縮ツールの並びが不定だった問題の修正
• [2022-02-02：v0.221]
• プロフィール画像などのシステム管理の画像は最適化対象外とした
• [2022-01-27：v0.22]
• アセット一覧画面においてバックアップされたオリジナル画像に復元する機能の実装
• バックアップディレクトリの設定がない場合、最適化動作が行われないようにした
• optimize_images コマンドで re-optimize オプションを用いた場合に、最適化済みのサムネイルについて、最適化の再実行が行われなくなるケースがある問題の修正
• [2022-01-26：v0.21]
• アセット一覧画面において画像以外のファイルが表示される場合に最適化フラグの表示を行おうとするとエラーになる問題の修正
• [2022-01-xx：v0.20]
• Movable Type 7に対応した
• 最適化ジョブを通さず直接最適化を行う機能を追加した
• アセット一覧画面で最適化済みフラグを表示・検索できるようにした
• コマンドラインツールoptimize_images、register_image_assetを追加した
• アセットを上書き更新した場合にサムネイルが再生成されない問題の修正
• [2018-06-xx：v0.10]
• 最初のリリース

このプラグインの利用、及び著作権や保証について

このプラグインの著作権は作者であるエムロジック株式会社 / M-Logic, Inc.が所有しています。著作権者の許可なく本プラグインを使用、改変、再配布することはできません。