没有考虑pagespeed_no_transform属性

时间:2018-10-04 10:49:15

标签: nginx pagespeed

我正在使用Nginx PageSpeed模块,但是在使用jquery.matchHeight.js管理的图像时遇到了问题。我决定禁用对这些特定图像的优化,为此我添加了pagespeed_no_transform属性(我也尝试了data-pagespeed-no-transform并没有成功):

<img src="https://example.com/image-icon_300.png" alt="Alt title" pagespeed_no_transform />

不幸的是,PageSpeed似乎没有考虑到该属性。更糟糕的是,它纯粹删除并进行优化。下面是呈现的代码:

<img src="https://example.com/image-icon_300.png.pagespeed.ce.gkz42_jTc5@2x.png" alt="Alt title" data-pagespeed-url-hash="627608977" onload="pagespeed.CriticalImages.checkImageForCriticality(this);" width="240" height="200">

在cas中,这与我的PageSpeed版本/配置有关,这是我的Nginx conf:

# Header X-Page-Speed: 1.13.35.2-0
server {
  # Ansible managed
  pagespeed on;
  pagespeed FileCachePath /var/ngx_pagespeed_cache;

  location ~ "\.pagespeed\.([a-z]\.)?[a-z]{2}\.[^.]{10}\.[^.]+" {
    add_header "" "";
  }
  location ~ "^/pagespeed_static/" { }
  location ~ "^/ngx_pagespeed_beacon$" { }
}

1 个答案:

答案 0 :(得分:0)

对于面临相同问题的人们来说,这似乎是完美的工作!

PageSpeed对图像进行了几种优化,主要是:

  • 转换(到PNG,JPEG或WebP)
  • 重新压缩
  • 调整大小
  • 内联
  • 缓存

使用data-pagespeed-no-transform属性时,您是在告诉PageSpeed不要“转换”图像,但这并不意味着它不会被缓存,这就是为什么您仍然请参见https://example.com/image-icon_300.png.pagespeed.ce.gkz42_jTc5@2x.png URL。

要知道图像是否已转换,您需要检查其URL:

  • 仅缓存:image-icon_300.png.pagespeed.ce.gkz42_jTc5@2x.png
  • 调整大小和缓存:150x150ximage-icon_300.png.pagespeed.ce.gkz42_jTc5@2x.png
  • 转换+调整大小+缓存:ximage-icon_300.png.pagespeed.ic.gkz42_jTc5@2x.webp
  • 内联:data:image/jpeg;base64,…