Gatsby: Gatsby-images increasing image size considerably

[ThiagoMiranda]

Hi..
I have a image ( this is happening with all images, so I´ll just show an example ) 1920x788 with 198kb and I´m loading with the Gatsby-image:

    bannerImage: imageSharp(id: { regex: "/bg-header/" }) {
      sizes(maxWidth: 1920, quality: 100) {
        ...GatsbyImageSharpSizes
      }
    },

The output of it is:
1920x768 - 556kb
960x384 - 711kb
480x192 193kb

Is there a way to "lock" the image size to be as big as my original version? Increasing the image size like that would waste the benefits of using gatbsy-images.

Thanks

[m-allanson]

Setting the quality to the maximum value will generally result in large files. Try adjusting quality to something less than 100, or leave it out altogether to default to 50.

I don't think there's support to lock the final file size to a specific value, but maybe you'd be able to write a plugin to do that. I imagine it'd be fairly intensive as there's no way to know what the final image size will be until it's been generated. So you'd end up reprocessing the image multiple times until you hit your size target.

[ThiagoMiranda]

@m-allanson I´ve setted to 90 and got a good file size/quality result. Thanks!