Search code examples
nginxpagespeed

pagespeed_no_transform attribute not taken in account

I'm using the Nginx PageSpeed module, and got an issue when it comes to images managed with jquery.matchHeight.js. I decided to disable optimization on these specific images, to I added the pagespeed_no_transform attribute (I also tried data-pagespeed-no-transform without success):

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

Unfortunately, PageSpeed does not seem to take this attribute in account. Worse, it purely remove it and do the optimization. Below is the rendered code:

<img src="https://example.com/[email protected]" alt="Alt title" data-pagespeed-url-hash="627608977" onload="pagespeed.CriticalImages.checkImageForCriticality(this);" width="240" height="200">

In cas this would be related to my PageSpeed version/configuration, here is my 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$" { }
}
Solution

  • For people who are facing the same issue, it appears it's perfectly working!

    PageSpeed to several optimisations on images, mainly:

    • Conversion (to PNG, JPEG or WebP)
    • Recompression
    • Resizing
    • Inlining
    • Caching

    When using the data-pagespeed-no-transform attribute, you're telling PageSpeed to not "transform" your image, but this not mean it won't be cached, and this is why you still see the https://example.com/[email protected] URL.

    To know if your image has been transformed, you need to check its URL: