Autoptimize
Autoptimize – HTML/CSS/JS Optimization
Autoptimizeは、HTML・CSS・JavaScriptを最小化・結合して読み込みを高速化する定番の最適化プラグインです。それ自体はページキャッシュを作らないため、WP Fastest Cache等のキャッシュプラグインと組み合わせて使うのが基本的な使い方です。無料のコア機能に加え、画像最適化・CDN連携・自動Critical CSS生成等を追加する有料の「Autoptimize Pro」も用意されており、無料の範囲でできる高速化の幅を広げてくれる、長年愛用者の多いプラグインです。
基本情報
| プラグイン名 | Autoptimize |
|---|---|
| 料金 | コア機能は無料/Autoptimize Pro(画像最適化・CDN・自動Critical CSS等)は有料のPower-Up形式で提供 |
| 開発・運営 | Frank Goossens(futtta)/Optimizing Matters |
| WordPress.org | wordpress.org/plugins/autoptimize/ |
| 特徴 | HTML/CSS/JSの最小化に特化。キャッシュプラグインとの併用が前提 |
| バージョン3.0以降の変更点 | HTTP/2の普及を踏まえ、新規インストールではCSS/JSの「結合(Aggregation)」が初期設定でオフに変更(最小化自体は引き続き有効) |
| 注意点 | 設定変更後は必ずサイトの表示崩れがないか確認が必要 |
主要機能
CSS/JS最小化・結合
複数のCSS・JavaScriptファイルを結合し、余分な空白やコメントを除去してファイルサイズとリクエスト数を削減する。
HTML最小化
HTMLソース内の不要な空白・改行・コメントを除去し、転送量を削減する。
Critical CSS対応
初期表示に必要な最小限のCSSを先読みさせるCritical CSS機能に対応(一部は有料アドオン)。
画像最適化連携
遅延読み込みや画像の最適化機能(ShortPixel等の外部サービス連携)も搭載している。
Googleフォント最適化
外部読み込みのGoogleフォントをローカルに保存・最適化し、外部リクエストを削減できる。
不要スクリプトの除外設定
特定のCSS/JSファイルを最適化の対象外にする設定が可能。表示崩れが起きた際の細かい調整に使える。
Autoptimize Pro(有料Power-Up)
画像最適化・CDN連携・自動Critical CSS生成・追加の高速化オプションを提供する有料アドオン。無料版だけでは手が届かない領域をカバーする。
キャッシュプラグインとの組み合わせ方
Autoptimizeはページキャッシュを作らないため、単体では効果が限定的です。以下のような組み合わせで使うのが一般的です。
| 組み合わせ | 役割分担 |
|---|---|
| Autoptimize + WP Fastest Cache | Autoptimizeがファイル最小化、WP Fastest Cacheがページキャッシュを担当 |
| Autoptimize + WP Super Cache | 同様の役割分担。Automattic製の組み合わせで安定性重視 |
設定後は必ずサイトの表示を確認してください。JSの結合順序によっては、まれにサイトの動作(スライダーやフォーム等)に影響が出ることがあります。問題が起きた場合は、該当のファイルを最適化除外リストに追加することで解決できます。
導入手順
1「プラグイン」→「新規追加」で「Autoptimize」を検索し、インストール・有効化
2「設定」→「Autoptimize」を開き、「JS、CSS&HTML」タブでJavaScript・CSSの最適化にチェックを入れて保存
3保存後、サイトの表示・主要な操作(スライダー・フォーム送信等)に問題がないか確認する
4問題があれば、該当するJS/CSSファイルを「除外」欄に追加して様子を見る
5キャッシュプラグイン(WP Fastest Cache等)も別途導入し、ページキャッシュ自体はそちらに任せる
よくある質問(FAQ)
- 無料版とAutoptimize Proの違いは何ですか?
無料版はHTML/CSS/JSの最小化・結合、Googleフォントの最適化等が中心です。Autoptimize Proはこれに加えて、画像の自動最適化・CDN連携・自動でのCritical CSS生成といった、無料版では手動設定が必要だったり対応していない機能を追加します。
- 設定後にスライダーやフォームが動かなくなりました
JavaScriptの結合順序が原因であることが多いです。「設定」→「Autoptimize」の除外欄に、問題が起きているファイル名を追加することで解決できます。開発者ツールのコンソールでエラーを確認すると、原因のファイルを特定しやすくなります。
- ページキャッシュ機能はありますか?
いいえ、Autoptimize自体にはページキャッシュ機能はありません。WP Fastest Cache・WP Super Cache等のキャッシュプラグインと併用することで、初めて総合的な高速化効果が得られます。
こんな人におすすめ
こんな人におすすめ
- キャッシュプラグインと組み合わせてさらに最適化したい
- CSS/JSの最小化・結合だけを無料で行いたい
- Critical CSSなど踏み込んだ最適化に興味がある
不要なケース
- これ1本だけで高速化を完結させたい(キャッシュプラグインの併用が必要)
- 設定をいじってサイトが崩れるのが不安(設定変更後は表示確認が必須)
まとめ
Autoptimizeは、HTML・CSS・JavaScriptの最小化・結合に特化した、長年愛用者の多い定番プラグインです。単体では効果が限定的なため、WP Fastest Cacheなどのキャッシュプラグインとセットでの利用が前提になります。無料版でも十分実用的ですが、画像最適化・CDN・自動Critical CSS生成まで求める場合はAutoptimize Proの導入も検討できます。バージョン3.0以降はHTTP/2環境を踏まえてファイル結合が初期設定でオフになっている点も押さえておきましょう。