Skip to content
This repository has been archived by the owner on Dec 22, 2021. It is now read-only.

Exclude source/original image in sharp GraphQL image queries #25

Open
wants to merge 2 commits into
base: master
Choose a base branch
from

Conversation

jpavlicek
Copy link

Add a feature flag to not include the source image in srcset when using gatsy-plugin-sharp and gatsby-transformer-sharp.

relativePath: { eq: "shop/myimage.jpg" }
) {
childImageSharp {
fluid(maxWidth: 800, excludeOriginal: false) {

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Wouldn't this be excludeOriginal: true?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You're absolutely right! Fixed :-)

@jlengstorf
Copy link

Overall I think this seems reasonable. Someone from @gatsbyjs/core will need to sign off, though.

@KyleAMathews
Copy link
Contributor

Why would you not want to include the original image?

@jpavlicek
Copy link
Author

If you have an image with 15 megapixels or bigger and want to keep your deployment as lean as possible, just for performance while deploying – if you're using your image with a width of 800px there is no need to "give away" an image with a width of 5000px to everybody on the web. Or perhaps you got the picture from a photographer and you're only allowed to use it up to a specific size in web. So it could be both performance or licensing reasons.

@pieh
Copy link

pieh commented Jan 11, 2019

Maybe different approach to filter out very large images would be to specify cutoff threshold to not include images bigger than (for example) 2000px? We potentially could even set some defaults for this.

This would let users not worry about context and know if used images are actually big or not (especially if site would pull data from CMS and developer is not in charge of content)?

@jpavlicek
Copy link
Author

jpavlicek commented Jan 22, 2019

Sorry for the late reply. I really think the threshold approach would be the perfect solution. Though I think the default should be without threshold. So we wouldn't have any change for existing users but extend it to have more control.

So I would propose either to have an option like threshold which applies both for max width and max height or a threshold for each width and height. For the sake of keeping it stupid and simple I'd prefer the threshold for both width and height.

@jlengstorf
Copy link

I'd agree that keeping behavior the same would be ideal for now. Maybe in the next major release we could set some guardrails up, though — seems like it would be good to save people from accidentally deploying 10MB images. 😅

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants