☰

mod_pagespeed 自己的 js 和 css 渲染阻止

tag-icon • tag-icon apache-2.2 performance mod-pagespeed page-speed
mod_pagespeed 自己的 js 和 css 渲染阻止

我的 mod_pagespeed 得分较低，因为它自己的 js 和 css 会阻塞渲染。鉴于该工具旨在加速而不是减慢速度，我认为这不是设计所期望的行为。有人遇到过这种情况吗？

以下是 Google PagSpeed Insights 的建议：

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

您可以在这里看到全图页面速度

我在 Apache 服务器上使用 Varnish 缓存，以下是我启用的 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 事实上不起作用，因为它仍然阻止渲染。

答案1

mod_pagespeed 团队向您问好。

我认为你这两点都是对的。js_defer.IRaJtkfeqL.js 可能会阻塞渲染，尽管它确实会在 HTML 文件的底部加载。我们开发了一种我们认为不错的机制，可以确保在为 priorityize_critical_css 渲染后加载非关键资源，但我们尚未将其应用于 js_defer 辅助脚本。

我正在跟踪这个问题https://code.google.com/p/modpagespeed/issues/detail?id=997

关于http://pacifika.ru/…d626d8e8.css.pagespeed.cf.Kr0UOart5j.css 加载时在头部阻塞，看起来 priority_critical_css 在您的网站上无法正常工作。信标已发送，服务器正确响应 204。但是，信标中的数据未得到应用。

我注意到您的服务器运行的是 mod_pagespeed 1.7，这个版本已经很旧了。我们已将 1.8 标记为稳定版本，1.9 处于测试阶段。您能升级吗，至少升级到我们的稳定版本？1.8 对信标机制进行了一些改进，这可能有助于优先化_关键_css 在您的网站上发挥作用。

字体问题是一个棘手的问题。我们决定不内联整个字体，因为它很大而且可缓存。但 inline_google_font_css 仍然有助于我内联 CSS 间接调用，从而消除了网站渲染前的一次往返。基本上，如果您想要自定义字体，则必须先将其下载到客户端，然后才能绘制页面，我们认为最好将其设置为可缓存，而不是内联。

相关内容