mod_pagespeed設定値

mod_pagespeed の設定に関して良い記事があったのでメモ。

https://www.cyberagent.co.jp/techinfo/techreport/report/id=7992

mod_pagespeed 自体は .htaccessファイル に以下の様に記述すれば有効になります。

元記事によると、詳細にフィルタを変更できるようです。

私のブログでは、WPXレンタルサーバーを使用しており、mod_pagespeed を利用できるので、以下の設定にて暫く様子を見ようと思います。

フィルタと概要(元記事から引用)

HTMLの記述方法を最適化するフィルタ

フィルタ名 解説 デフォルト
add_head <head> 要素がない場合は挿入する。 オン
combine_heads <head> 要素が2つ見つかった場合は1つに統合する。
inline_import_to_link CSSの@importsしか行なっていない<style>タグを <link> タグによる読込に書き換える。 オン
move_css_above_scripts CSS要素を<script>タグよりも上に移動する。
move_css_to_head CSS要素を<head>タグ内に移動する。
collapse_whitespace 不要な空白を除去する。(以下のタグ内は行わない: <pre>, <script>, <style>, <textarea>).
elide_attributes HTMLの仕様に従っていない属性は除去する。
extend_cache 最適化を行わなかったCSS、JSおよび画像のキャッシュ保持期間をコンテンツのハッシュ付きURLを付与することで延長する。 オン
extend_cache_css 最適化を行わなかったCSSのキャッシュ保持期間をコンテンツのハッシュ付きURLを付与することで延長する。( extend_cacheで暗黙的に呼び出される。 ) オン
extend_cache_images 最適化を行わなかった画像のキャッシュ保持期間をコンテンツのハッシュ付きURLを付与することで延長する。( extend_cacheで暗黙的に呼び出される。 ) オン
extend_cache_scripts 最適化を行わなかったJSのキャッシュ保持期間をコンテンツのハッシュ付きURLを付与することで延長する。( extend_cacheで暗黙的に呼び出される。 ) オン
extend_cache_pdfs PDFのキャッシュ保持期間をコンテンツのハッシュ付きURLを付与することで延長する。
convert_meta_tags meta タグのうち http-equiv 属性のものをレスポンスヘッダ値に置き換える。 オン
trim_urls URLをベースURLからの相対パスに書き換えることで短くする。
remove_quotes HTMLの各属性の中にある文法上必須でない引用符を除去する。
remove_comments HTML内のコメントを除去する。(ただしインラインのJS/CSSは除く)

JS/CSSのリソースを最適化するもの

フィルタ名 解説 デフォルト
combine_css 複数のCSS要素を1つに結合する。 オン
rewrite_css CSS内のスペースやコメントを除去する。また画像系オプションが有効な場合、CSS内でロードしている画像も書き換えたりキャッシュ延長の対象とする。 オン
fallback_rewrite_css_urls 解析・圧縮できないCSSでもURLに関しては書き換えを行うフォールバックオプション。 オン
rewrite_style_attributes スタイル属性内のCSSもルールに基づき最適化する。
rewrite_style_attributes_with_url スタイル属性内のurlを含むCSSルールも、rewite_cssの設定を適用する。 オン
flatten_css_imports @import句を事前に読み込み1枚のフラットファイルにする。 オン
rewrite_javascript Javascript内の不要な空白やコメントを除去する。 オン
combine_javascript 複数のJavascriptを1枚のファイルにする。
inline_css 小さな外部CSSファイルを、HTML内に埋め込む。 オン
inline_javascript 小さな外部JSファイルをHTML内に埋め込む。 オン
outline_css 巨大なHTML内のCSS記述をキャッシュ可能な外出しファイルにする。
outline_javascript 巨大なHTML内のJS記述をキャッシュ可能な外出しファイルにする。

画像ファイルを最適化するもの

フィルタ名 解説 デフォルト
rewrite_images 画像の最適化、再エンコード、不要なピクセルの除去を行う。また、小さな画像はインライン化する。 オン
convert_jpeg_to_progressive 巨大なjpegファイルをプログレッシブファイルに変更する。 オン
convert_png_to_jpeg gifやpngファイルをjpegにする。
convert_jpeg_to_webp ブラウザがサポートしている場合、jpegをwebpに変換して提供する。
insert_image_dimensions <img> タグに width と height 属性がない場合は追加する。
inline_images 小さな画像の読み込みをdata: urls方式に置き換えます。( rewrite_imagesで暗黙的に呼び出される。 ) オン
recompress_images 画像を再圧縮し、不要なメタデータを削除し、gifの場合はpngに変換します。( rewrite_imagesで暗黙的に呼び出される。 ) オン
recompress_jpeg jpegファイルを再圧縮しメタデータを削除する。( recompress_imagesで暗黙的に呼び出される。 ) オン
recompress_png pngファイルを再圧縮しメタデータを削除する。( recompress_imagesで暗黙的に呼び出される。 ) オン
recompress_webp webpファイルを再圧縮しメタデータを削除する。( recompress_imagesで暗黙的に呼び出される。 ) オン
convert_gif_to_png gifファイルをpngに変換して最適化する。( recompress_imagesで暗黙的に呼び出される。 ) オン
strip_image_color_profile 画像内のカラープロファイルを除去する。( recompress_imagesで暗黙的に呼び出される。 ) オン
strip_image_meta_data 画像内のEXIFメタデータを除去する。( recompress_imagesで暗黙的に呼び出される。 ) オン
jpeg_sampling jpegのカラーサンプリングを4:2:0にする。( recompress_imagesで暗黙的に呼び出される。 ) オン
resize_images <img> タグの width と height 属性値に比べ画像が大きい場合は縮小する。( rewrite_imagesで暗黙的に呼び出される。 ) オン
inline_preview_images ロード完了後にオリジナル画像に置き換わるプレースホルダーとして、インラインの低クオリティ画像を作成・使用する。
resize_mobile_images inline_preview_images と似た動作をするが、モバイルブラウザにのみ小さい画像を提供する。
sprite_images バックグラウンド画像を結合して一つのスプライト画像にする。
local_storage_cache インライン化されたリソースをHTML5のローカルストレージにキャッシュする。

その他

速度改善に直接関係ない、あるいはWEBアプリのJS動作への影響が大きいフィルタ

フィルタ名 解説
defer_javascript JavaScriptの実行をHTMLページがロード完了するまで遅延させる。
lazyload_images クライアントの表示領域にはいるまで画像をロードしない。
insert_dns_prefetch DNSの解決速度を上げるため <link rel=”dns-prefetch” href=”//www.example.com”> タグを挿入する。
make_google_analytics_async Google Analyticsの同期タグがあった場合非同期タグに書き換える。
rewrite_domains pagespeed.conf で指定されていないmod_pagespeed外のコンテンツのドメインを書き換える。
pedantic <script> と <style> タグにデフォルト属性が書かれておらず、かつページがHTML5でない場合、属性を追加する。このフィルタはpagespeedがHTML4のバリデーションを壊さないためにある。
add_instrumentation 計測用JavaScriptを追加しレイテンシを測定、かつサーバに結果を送り返す。
insert_ga Google AnalyticsのJSタグを各ページに挿入する。
canonicalize_javascript_libraries Javascriptライブラリの読み込みをJavascriptホスティングサービスのものに変更する。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする