responsive-image handling adds entries to srcset even if the source image is smaller

[jan-23]

I have a set of images and some are large some are small.

My setup looks like this:

    'large': {
        'type': 'responsive-image',
        'srcset': [
            ('1000w', ["scale_out 1000 1 False"]),
            ('2000w', ["scale_out 2000 1 False"]),
            ('3000w', ["scale_out 3000 1 False"])
        ],
        'default': '1000w',
    },

I want 3 image sizes and no upscaling.

If the input image img_a.jpg is 3500px wide. I get a perfect srcset of:

<img 
   class="image-process-large" src="/large/1000w/img_a.jpg" 
   srcset="/large/1000w/img_a.jpg 1000w, /large/2000w/img_a.jpg 2000w, /large/3000w/img_a.jpg 3000w"/>

Where /large/1000w/img_a.jpg is 1000px wide, /large/2000w/img_a.jpg is 2000px wide and /large/3000w/img_a.jpg is 3000px wide.

But if I have an image img_b.jpg that is 1500px wide. I get the same srcset:

<img 
   class="image-process-large" src="/large/1000w/img_b.jpg" 
   srcset="/large/1000w/img_b.jpg 1000w, /large/2000w/img_b.jpg 2000w, /large/3000w/img_b.jpg 3000w"/>

Where /large/1000w/img_b.jpg is 1000px wide, /large/2000w/img_b.jpg is 1500px wide and /large/3000w/img_b.jpg is also 1500px wide.

It would be better if

• /large/2000w/img_b.jpg and /large/3000w/img_b.jpg are not generated since they are not adding any information
• the original image is used as a fallback

I propose that the generated tag sould look like this:

<img 
   class="image-process-large" src="/large/1000w/img_b.jpg" 
   srcset="/large/1000w/img_b.jpg 1000w, /img_b.jpg"/>