Hello, I’m building a mobile app for our store using the GraphQL Storefront API. We keep running into a timeout issue when querying for our products.
Our store has in total about 750 products, with about 5000 variants. There are about 65 available for sale with around 500 variants that we’re trying to retrieve when the app starts.
When trying to load the 65 products at once using the query below, we’d frequently get this timeout response. Paginating the query to do 10 at a time reduces the frequency of timeouts but doesn’t prevent it altogether. Removing fields from the query doesn’t seem to help things massively.
So what I’d like to understand is:
- Why are the requests timing out? Is this a kind of rate limiting?
- Do I need to reduce the complexity of the query? If so, any suggestions for which bits are making it timeout?
- Are there changes we can make to our store to improve speed and reduce timeouts? E.g archiving old variants or products, deleting unused metafields etc.
Response
"errors": [
{
"message": "Timeout",
"extensions": {
"code": "TIMEOUT"
}
}
],
"status": 200,
Query
query getProducts($numProducts: Int!, $cursor: String){
products(
first: $numProducts
after: $cursor
query: "
status:active
AND product_type:Feast
AND available_for_sale:true
AND 'show in menu'
"
) {
pageInfo {
hasNextPage
endCursor
}
edges {
node {
id
title
handle
createdAt
productType
vendor
images(first: 20) {
edges {
node {
sm: url(transform: { maxHeight: 120, maxWidth: 180, crop: CENTER })
md: url(transform: { maxHeight: 412, maxWidth: 618, crop: CENTER })
lg: url(transform: { maxHeight: 618, maxWidth: 927, crop: CENTER })
xl: url(transform: { maxHeight: 1235, maxWidth: 1853, crop: CENTER })
}
}
},
variants(first: 100) {
edges {
node {
id
sku
title
price {
amount
}
availableForSale
quantityAvailable
compareAtPriceV2 {
amount
}
image {
sm: url(transform: { maxHeight: 120, maxWidth: 180, crop: CENTER })
md: url(transform: { maxHeight: 412, maxWidth: 618, crop: CENTER })
lg: url(transform: { maxHeight: 618, maxWidth: 927, crop: CENTER })
xl: url(transform: { maxHeight: 1235, maxWidth: 1853, crop: CENTER })
}
deliveryDate: metafield(key: "delivery_date", namespace: "fields") {
value
}
}
}
}
shortDescription: metafield(key: "shortDescription", namespace: "accentuate") {
value
}
...(+10 similar metafields)
}
}
}