Google PageSpeedInsightsはどんなケースで「画像を最適化する」と怒るのか

画像を最適化する、のページではjpegtranなどでロスレス圧縮しろ言ってくるが、腑に落ちないので調べてみた。

気になっている点

  • imgタグのwidth, heightよりも大きい画像を使うと怒られるのか(ブラウザが画像を縮小して表示するので遅くなるはずだ)
  • 非可逆圧縮もやれと怒るのか

実験

一眼レフのカメラで撮った写真をmacのpreviewを使って、500×500にトリミングしたものを用意した。
この画像をベースに以下の条件を作ってやってみる。

  • 圧縮
    • 未圧縮、可逆圧縮(jpegtran -copy none -optimize)、非可逆圧縮(macのpreviewで50%で書きだした)
  • 画像の大きさ
    • imgのwidth,heightと一致する、しない

できあがったのがこれ

ちなみにjpegtranによって、8KBほど小さくなった!

結果

res

非可逆圧縮のものだけ怒られた。
未圧縮のものは怒られなかったのはなぜ…?

考察

jpegtranなどで可逆圧縮すれば黙らせることができる。
jpegの未圧縮のものは怒られなかったのが腑に落ちないけど、オリジナルの画像を使う意図を汲んでいるということでしょうか?(例えば写真素材屋の写真)。
よーし!どんどん可逆圧縮しろー!という気持ちにならないでもないですが、EXIFには有用な情報がたくさんあるので、よく考えてやるべき。

スッキリ。

もちろん、やりたいのはPageSpeedInsightsに怒られないようにすることではなく、ページの表示を速くすることで、俺達の戦いはまだこれからだ!
カイバ先生の次回作にご期待ください!

この投稿へのコメント

コメントはありません。

コメントを残す

メールアドレスが公開されることはありません。

この投稿へのトラックバック

トラックバックはありません。

トラックバック URL