alexlobera / gatsby-source-sanity-transform-images

Gatsby plugin
https://www.gatsbyjs.org/packages/gatsby-source-sanity-transform-images/
19 stars 7 forks source link

Timeout error #10

Open chandlervdw opened 4 years ago

chandlervdw commented 4 years ago

I'm consistently getting a timeout error when trying to download locally. Is there a way to extend the timeout past 30000ms or does this have to do with graphql under the hood?

atxnyc commented 4 years ago

I was having trouble with this as well, I found some documentation on a .env variable GATSBY_CONCURRENT_DOWNLOAD which limits the number of concurrent downloads down from the default of 200.

Still poking around to find the best value for this, but so far a value of 10 seems to prevent the timeout issue for me. I think its possible that the 200 concurrent requests might have been flooding sanity and causing it to hang for too long and timeout

I'm seeing a relatively negligible impact on build times with this change, even though it slows down the downloads a bit, its the thumbnails that take all of the time.

atxnyc commented 4 years ago

actually, that did not seem to solve the issue, I found this though: https://github.com/gatsbyjs/gatsby/issues/23123

it seems that the timeout setting might be causing issues because it needs everything to be downloaded in 30 seconds. I reverted my gatsby-source-filesystem to 2.1.47 and now I get a complaint about a deprecated field, but everything works. Better solution would be great but at least this allows me to build without the timeout issue every time!

alexlobera commented 4 years ago

@chandlervdw @atxnyc I'm sorry to hear you are having some problems with this plugin. I also experienced that problem and I did 2 things to mitigate that: 1- Use GATSBY_CONCURRENT_DOWNLOAD as pointed out by @atxnyc 2- Make sure you transform the images on Sanity before downloading it to Gatsby. If you download the full image and then use Sharp on Gatsby then it'll take more time than downloading an optimized image. 1st example is good, 2nd example is not good:

query Good {
  allSanityImageAsset {
    nodes {
      url
      localFile(width: 500) {
        childImageSharp {
          fixed {
            src
          }
        }
      }
    }
  }
}

query NotGood {
  allSanityImageAsset {
    nodes {
      url
      localFile {
        childImageSharp {
          fixed(width: 500) { # <- at this point you downloaded a large image to you local
            src
          }
        }
      }
    }
  }
}
bradley commented 3 years ago

Thank you for the gatsby-source-filesystem version suggestion @atxnyc that really seems to be saving me some headache now.