web-dev-qa-db-ja.com

mod_pagespeed独自のjsおよびcssレンダリングブロッキング

私のmod_pagespeedは、それ自体のjsとcssがレンダリングをブロックしているため、スコアが低くなります。ツールが速度を落とすのではなく速度を上げるように設計されていることを考えると、これは設計上望ましい動作ではないと思います。誰かがこれに遭遇したことがありますか？

Google PagSpeedInsightsの推奨事項は次のとおりです。

Remove render-blocking JavaScript:

http://pacifika.ru/…_pagespeed_static/js_defer.IRaJtkfeqL.js

そして

Optimize CSS Delivery of the following:

http://pacifika.ru/…d626d8e8.css.pagespeed.cf.Kr0UOart5j.css
http://fonts.googleapis.com/css?family=Bitter&subset=latin

ここで全体像を見ることができます Pagespeed

私はVarnishキャッシュを使用しているApacheサーバー上にあり、有効にしたmod_pagespeedルールは次のとおりです。

ModPagespeedEnableFilters extend_cache,combine_javascript,local_storage_cache,rewrite_images
ModPagespeedEnableFilters rewrite_javascript,rewrite_css,Sprite_images,rewrite_style_attributes
ModPagespeedEnableFilters collapse_whitespace,elide_attributes,remove_comments
ModPagespeedEnableFilters outline_css,move_css_above_scripts,move_css_to_head
ModPagespeedEnableFilters make_google_analytics_async,inline_google_font_css
ModPagespeedEnableFilters defer_javascript,prioritize_critical_css

Inline_google_font_cssはまだレンダリングをブロックしているため、事実に対して機能しないことを私は知っています。

apache-2.2performancemod-pagespeedpage-speed
2
Vlad

Mod_pagespeedチームからこんにちは。

私はあなたが両方の点で正しいと思います。 js_defer.IRaJtkfeqL.jsは、HTMLファイルの下部にロードされますが、レンダリングをブロックする可能性があります。私たちは、prioritize_critical_cssのレンダリング後に重要でないリソースがロードされることを保証するための優れたメカニズムであると考えるものを開発しましたが、これをjs_deferヘルパースクリプトにまだ適用していません。

私はこの問題を https://code.google.com/p/modpagespeed/issues/detail?id=997 として追跡しています

RE http://pacifika.ru/ …d626d8e8.css.pagespeed.cf.Kr0UOart5j.cssがロードされて頭にブロックされているため、prioritize_critical_cssがサイトで正しく機能していないようです。ビーコンが送信されており、サーバーは204で正しく応答しています。ただし、ビーコンからのデータは適用されていません。

あなたのサーバーがかなり古いmod_pagespeed1.7を実行していることに気づきました。 1.8を安定版リリースとしてマークし、1.9をベータ版にしています。少なくとも安定したチャネルにアップグレードできますか？ 1.8では、ビーコンメカニズムがいくつか改善されており、サイトでのpriority_critical_cssの動作に役立つ可能性があります。

フォントの問題は難しい問題です。フォントは大きくてキャッシュ可能であるため、フォント全体をインライン化しないことにしました。ただし、inline_google_font_cssは、CSSの間接参照をインライン化するのに役立ち、サイトがレンダリングされる前に1回のラウンドトリップを削除します。基本的に、カスタムフォントが必要な場合は、ページを描画する前にクライアントにダウンロードする必要があります。ここでは、インライン化するよりもキャッシュ可能にする方がよいと考えています。

2
Joshua Marantz