feat: `mobileFirst` sizes strategy

[nagman]

Hi,

I've added a feature that allows developper to opt between desktop-first and mobile-first strategies.

The default behavior is desktop-first (because it uses max-width media queries in the sizes attribute), but the recommended approach for CSS is mobile-first.

So in order to keep consistency between template and css, we can now opt for mobile-first strategy, and it will replace the media-queries with a min-width syntax, and sort the screens in descending order (while keeping the lowest screen as the default one).

Looking forward to use this feature in my current project :)

I've also updated the docs part on sizes as it was not detailed enough for developers who really care about image optimization.

[mickaelchanrion]

Nice PR! I'm thinking, the term strategy could be used for something more "image-related" in the future. Hence I'd suggest an option name more descriptive for this feature like:

• breakpointStrategy
• responsiveStrategy
• mqStrategy
• mobileFirst? (then it would be a boolean, set to false by default) - Seems to be the best option IMO as I don't think there would be a value other than 'mobile-first' or 'desktop-first'

[nagman]

Here, I've renamed it to mobileFirst and it's a boolean, now

[frodrigo]

Also interested in this feature. Hope it will be merged.

[RyanMulready]

Any chance this gets picked back up? We hit it a scenario today wanting to use preload but only for desktop images. I believe this would solve it.