[GitHub] [incubator-pagespeed-ngx] NileshBhosale1993 opened a new issue #1725: Webp conversion not happening for srcset URL of element.

[GitBox]

NileshBhosale1993 opened a new issue #1725:
URL: https://github.com/apache/incubator-pagespeed-ngx/issues/1725


   Following are the details of my setup and more details about my problem that 
I am facing.
   
   System info:
        nginx-1.18
        php7.3
        ubuntu 20.04(64-bit)
   
   We have used the following page speed config: 
           pagespeed on;
           # Needs to exist and be writable by nginx.  Use tmpfs for best 
performance.
           pagespeed FileCachePath /var/ngx_pagespeed_cache;
   
           pagespeed RedisServer "127.0.0.1:6379";
           pagespeed RedisDatabaseIndex 3;
   
   
           pagespeed EnableFilters inline_images,sprite_images;
           pagespeed EnableFilters recompress_images;
           pagespeed EnableFilters convert_png_to_jpeg;
           pagespeed EnableFilters convert_jpeg_to_webp;
           pagespeed EnableFilters strip_image_color_profile;
   
           location ~ "\.pagespeed\.([a-z]\.)?[a-z]{2}\.[^.]{10}\.[^.]+" {
               add_header "" "";
           }
           location ~ "^/pagespeed_static/" { }
           location ~ "^/ngx_pagespeed_beacon$" { }
   
   We have used the picture element for setting the different size images based 
on screen size. It only does the conversion for img tag src URL. Webp 
conversion not happening for srcset URL of <picture> element.
   
                <picture>
               <source media="(max-width: 360px)" 
data-srcset="https://stagingmedia.ugaoo.com/catalog/product/cache/3bcb0a6e08590604b54b12a761d0d160/a/g/aglaonemapinkbeauty_45_1.png";
 
srcset="https://stagingmedia.ugaoo.com/catalog/product/cache/3bcb0a6e08590604b54b12a761d0d160/a/g/aglaonemapinkbeauty_45_1.png";>
               <source media="(max-width: 420px)" 
data-srcset="https://stagingmedia.ugaoo.com/catalog/product/cache/a3d4219d5a995f821f474bb151af7bc9/a/g/aglaonemapinkbeauty_45_1.png";
 
srcset="https://stagingmedia.ugaoo.com/catalog/product/cache/a3d4219d5a995f821f474bb151af7bc9/a/g/aglaonemapinkbeauty_45_1.png";>
               <source media="(max-width: 480px)" 
data-srcset="https://stagingmedia.ugaoo.com/catalog/product/cache/5d1a0f4f639586f2a4e5aba5ccf56d10/a/g/aglaonemapinkbeauty_45_1.png";
 
srcset="https://stagingmedia.ugaoo.com/catalog/product/cache/5d1a0f4f639586f2a4e5aba5ccf56d10/a/g/aglaonemapinkbeauty_45_1.png";>
 
               <source media="(max-width: 630px)" 
data-srcset="https://stagingmedia.ugaoo.com/catalog/product/cache/de5a1463ba3f5a599da9bf4103f0c2f6/a/g/aglaonemapinkbeauty_45_1.png";
 
srcset="https://stagingmedia.ugaoo.com/catalog/product/cache/de5a1463ba3f5a599da9bf4103f0c2f6/a/g/aglaonemapinkbeauty_45_1.png";>
               <source media="(max-width: 765px)" 
data-srcset="https://stagingmedia.ugaoo.com/catalog/product/cache/86c757893017d52d78bc8fcee90863c3/a/g/aglaonemapinkbeauty_45_1.png";
 
srcset="https://stagingmedia.ugaoo.com/catalog/product/cache/86c757893017d52d78bc8fcee90863c3/a/g/aglaonemapinkbeauty_45_1.png";>
               <source media="(max-width: 900px)" 
data-srcset="https://stagingmedia.ugaoo.com/catalog/product/cache/67150557dcf8de3036f902b0a5817f90/a/g/aglaonemapinkbeauty_45_1.png";
 
srcset="https://stagingmedia.ugaoo.com/catalog/product/cache/67150557dcf8de3036f902b0a5817f90/a/g/aglaonemapinkbeauty_45_1.png";>
               <source media="(max-width: 1024px)" 
data-srcset="https://stagingmedia.ugaoo.com/catalog/product/cache/b45688523f1fc6a85e3edff51b086a23/a/g/aglaonemapinkbeauty_45_1.png";
 
srcset="https://stagingmedia.ugaoo.com/catalog/product/cache/b45688523f1fc6a85e3edff51b086a23/a/g/aglaonemapinkbeauty_45_1.png";>
               <source media="(max-width: 1400px)" 
data-srcset="https://stagingmedia.ugaoo.com/catalog/product/cache/7fc5ce79f785a179cb820ac95672874b/a/g/aglaonemapinkbeauty_45_1.png";
 
srcset="https://stagingmedia.ugaoo.com/catalog/product/cache/7fc5ce79f785a179cb820ac95672874b/a/g/aglaonemapinkbeauty_45_1.png";>
               <img class="product-image-photo lazyloaded" 
src="https://stagingmedia.ugaoo.com/catalog/product/cache/bf904fa088be7169b4178c352b6a4f7a/a/g/xaglaonemapinkbeauty_45_1.png.pagespeed.ic.EzzjczwMwq.webp";
 
data-src="https://stagingmedia.ugaoo.com/catalog/product/cache/bf904fa088be7169b4178c352b6a4f7a/a/g/xaglaonemapinkbeauty_45_1.png.pagespeed.ic.EzzjczwMwq.webp";
 max-width="609" max-height="812" alt="Aglaonema Pink Beauty Plant" 
title="Aglaonema Pink Beauty Plant" data-pagespeed-url-hash="1469013157" 
onload="pagespeed.CriticalImages.checkImageForCriticality(this);">   
           </picture>
   
   Is there any configuration available to make it work? 


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
us...@infra.apache.org