Googleが提供しているmod_pagespeedを利用し始めて間もないのですが、スマートフォン向けサイトのレスポンスが随分と早くなりパフォーマンスチューニングの手間を一挙に解消できました。
なんて素晴らしいものだろう!と感動していたら、担当者から「画像が汚い気がする…」と。
気のせい気のせい!とか言おうと思ったんですが、iPhoneで確認してみると確かに粗い箇所がありました。
スマフォサイトでも解像度の高い端末に向けて、画像ファイルを大きめに作っているのですが、html内にwidth, heightが直接px指定されていることが原因でした。
%指定にしてみるとキレイになったのですが、該当箇所が複数あったので、mod_pagespeedのconfをいじることにしました。
pagespeed.conf
#ModPagespeedDisableFilters rewrite_images
ModPagespeedDisableFilters rewrite_images
defaultのままであれば、L56に #ModPagespeedDisableFilters rewrite_images となっている箇所があるので、コメントアウトを解除して、rewrite_imagesのフィルタを無効にしてあげれば、画像ファイルを最適化してキャッシュすることをしなくなりました。
その他、画像のフィルタが以下のように用意されていたのですが、今回の場合、何が適しているのかを調べている時間もなかったので、上記対応で完了としてます。
https://developers.google.com/speed/docs/mod_pagespeed/filter-image-optimize?hl=ja