Lottie 最適化ツール

概要

Lottieオプティマイザーは、Lottie JSONアニメーションファイルを受け取り、エディタ専用フィールドを削除し浮動小数点の精度を小数点以下3桁に統一することで、再生に影響を与えずにファイルサイズを削減します。複数ファイルを一度にアップロードでき、すべての処理はブラウザ内でローカルに完結し、サーバーへのアップロードはありません。

どの程度サイズを削減できるか

圧縮効果は元のファイルに含まれる冗長データの量によって変わります。After EffectsやLottieFilesから直接エクスポートしたファイルには、再生中には不要なレイヤー名(nm)、マッチ名(mn)、非表示フラグ(hd)、インデックスフィールド(ix)が大量に含まれていることが多いです。これらを削除すると、典型的なエクスポートで20〜50%、複雑なプロジェクトファイルでは60%以上の削減が期待できます。各ファイルの最適化前後の正確なサイズと変化率が表示されます。

125.48 KB  →  67.92 KB  (-46%)

オプティマイザーが実際に削除するもの

削除フィールド:レイヤー名(nm)、マッチ名(mn)、非表示マーカー(hd)、インデックス(ix)、および空のエフェクト配列(ef: [])。

数値処理:浮動小数点値は小数点以下3桁に丸められ、整数はそのまま保持されます。これによりアニメーションカーブの視覚的精度を損なわずにJSONのテキスト長を削減します。

バッチ処理とダウンロード

1回のセッションで複数の.jsonファイルをアップロードできます。各ファイルにアニメーションプレビューとサイズ比較パネルが表示されます。ダウンロードボタンはファイルごとにあり、出力ファイル名にはoptimized-のプレフィックスが付きます。

最適化すべきタイミングと不要なタイミング

最適化に適したケース

  • AEプラグインから直接エクスポートしたファイル(デバッグフィールドが多い)
  • CDNで配信するアニメーションやモバイルの初回表示で使うアニメーション
  • 編集が完了し本番環境用のコピーが必要なファイル

最適化を省略してよいケース

  • AEやLottieFilesでまだ編集が必要なファイル
  • 元々非常に小さいファイル(5 KB未満):削減効果はほぼない