Image Optimizer機能の設定
Image Optimizer機能はWebサイト内の画像を自動的に次世代フォーマット(WebP/AVIF)に変換し、Booster CDNを通じて配信します。これにより画像データのサイズが削減され、結果としてページ表示速度の向上とオリジンサーバーへのトラフィックの低減が期待できます。
目次
Reproの管理画面へアクセスし、メニューから「設定 > Booster設定」を選択、「Booster設定」画面を開きます。
Repro Boosterにはモバイル用とデスクトップ用の設定があります。それぞれ設定を行ってください。
また初期設定においては、必ずしもすべての設定項目に言及しません。言及のない項目については操作を行わずスキップしてください。
設定が完了したら「保存」ボタンをクリックして設定内容を保存してください。
導入サイトのドメイン
Repro Boosterを導入するWebサイトのドメイン(ホスト名)を指定します。指定は正規表現を用いて行ってください。
🔗 参考リンク
画像配信サーバーのドメイン
画像配信サーバーのドメイン(ホスト名)を指定します。指定は正規表現を用いて行ってください。
🔗 参考リンク
対象URL
Image Optimizer機能による変換の対象を指定します。正規表現を用いて、対象とするURLのパターンを指定してください。
特に理由がなければ、画像配信サーバーのすべての画像にマッチするよう^https://images\.example\.com/
のように指定します。
⚠️ 対象URLには画像のURLにマッチするパターンを指定してください。対象とする画像を含むページのURLにマッチするパターンを指定しても変換は適用されません。
💡
- 対象URLと除外URLの両方にマッチした場合は、除外URLの設定が優先されます。
- 意図しないURL(クエリ文字列に含まれるURLなど)が対象になることを防ぐため、対象URLの先頭には
^
を入力する必要があります。^
は「文字列の先頭」を意味する正規表現の記号で、設定したURLで始まるものだけを対象とすることができます。
🔗 参考リンク
除外URL
変換の対象とすべきでない画像をImage Optimizer機能による変換の対象から除外します。正規表現を用いて、除外するURLのパターンを指定してください。
少なくとも以下の条件に該当する画像は除外するよう設定してください。
- URLが固定で、内容が更新された際に変更を即座に反映する必要のある画像
- URLが固定で、Cookieや、その他のヘッダなどにより、内容が変更される画像
- Animated PNG(APNG)形式の画像
これは意図しない画像がBooster CDNにキャッシュされ、誤ってユーザーに表示されることを防ぐためです。
変換された画像はURL単位でキャッシュされるため、上記のような画像を変換の対象とした場合、「更新が反映されない」「意図しない画像が表示される」といった問題が発生します。
なお、1.については、可能であれば、画像の内容を変更する際にURLも合わせて変更する運用方針に切り替えることもご検討ください。また、3.のAnimated PNG形式の画像については、Image Optimizer機能では変換がサポートされていないため、除外設定を行ってください。
💡
対象URLと除外URLの両方にマッチした場合は、除外URLの設定が優先されます。
🔗 参考リンク