next/image timeout
Unanswered
Shayokh posted this in #help-forum
ShayokhOP
I am trying to load some heavy images from sanity cms. I often get [Error [TimeoutError]: The operation was aborted due to timeout].
I found out that next/image has a timeout of 7 seconds. How do I edit that?
I found out that next/image has a timeout of 7 seconds. How do I edit that?
31 Replies
ShayokhOP
ping
Facing same issue today
✓ Starting...
✓ Ready in 1075ms
○ Compiling / ...
✓ Compiled / in 11s
GET / 200 in 11441ms
○ Compiling /blogs ...
✓ Compiled /blogs in 13.9s
GET /blogs 200 in 14053ms
[Error [TimeoutError]: The operation was aborted due to timeout] {
code: 23,
INDEX_SIZE_ERR: 1,
DOMSTRING_SIZE_ERR: 2,
HIERARCHY_REQUEST_ERR: 3,
WRONG_DOCUMENT_ERR: 4,
INVALID_CHARACTER_ERR: 5,
NO_DATA_ALLOWED_ERR: 6,
NO_MODIFICATION_ALLOWED_ERR: 7,
NOT_FOUND_ERR: 8,
NOT_SUPPORTED_ERR: 9,
INUSE_ATTRIBUTE_ERR: 10,
INVALID_STATE_ERR: 11,
SYNTAX_ERR: 12,
INVALID_MODIFICATION_ERR: 13,
NAMESPACE_ERR: 14,
INVALID_ACCESS_ERR: 15,
VALIDATION_ERR: 16,
TYPE_MISMATCH_ERR: 17,
SECURITY_ERR: 18,
NETWORK_ERR: 19,
ABORT_ERR: 20,
URL_MISMATCH_ERR: 21,
QUOTA_EXCEEDED_ERR: 22,
TIMEOUT_ERR: 23,
INVALID_NODE_TYPE_ERR: 24,
DATA_CLONE_ERR: 25
}
○ Compiling /_error ...
✓ Compiled /_error in 828ms
GET /_next/image?url=https%3A%2F%2Fcdn.sanity.io%2Fimages%2F1unvbypl%2Fproduction%2Fb6aa35a3742851d50ced4aff32038017dfbd18d4-3250x1500.jpg&w=1080&q=75 500 in 7959ms
GET /_next/image?url=https%3A%2F%2Fcdn.sanity.io%2Fimages%2F1unvbypl%2Fproduction%2Fb6aa35a3742851d50ced4aff32038017dfbd18d4-3250x1500.jpg&w=1080&q=75 500 in 911ms
ShayokhOP
ping
ShayokhOP
ping
ShayokhOP
ping
there is no way it is hardcoded
also chaning it is bad idea
what the hell your image cannot be loaded 7 seconds
actually not loaded. your image can be slowly loaded but server should respond max in 7 seconds
ShayokhOP
Wdym man? What solution am I supposed to obtain from your response?
@Shayokh Wdym man? What solution am I supposed to obtain from your response?
i sent you source code of next js. 7 seconds timeout is hardcoded value you cannot configure it unless change source code of next and build yourself
ShayokhOP
So, I need to clone NextJs and build from scratch just to change a value? Like seriously?
@Shayokh So, I need to clone NextJs and build from scratch just to change a value? Like seriously?
yes because it is hardcoded
but your problem is not next. your problem is why your image server does not send anything for 7 seconds
Philippine Crocodile
Although I disagree with magic number, it is kind of weird to take over 7 seconds...
If it's taking over 7 seconds, perhaps you should look into converting it to a different format or not optimizing at all. You can use the img tag directly.
If it's taking over 7 seconds, perhaps you should look into converting it to a different format or not optimizing at all. You can use the img tag directly.
a counterargument would be, if it takes over 7 seconds you should optimise that loading time instead of forcing users to wait 7 seconds by using <img> lol
but yes, no images should take 7 seconds to load, ever.
if you must have the image take 7+ seconds to load, and you absolutely cannot fix it at all costs, then
patch-package
the nextjs package to edit that hardcode to something else@Nobody are you using sanity, as it usually happens with sanity
Check this also: https://nextjs-forum.com/post/1351599392158781461
Are you using sanity CDN?
for image
I am not asker
Oh my bad
I believe the issue is lying in sanity CDN as its taking longer for it to deliver the image
@joulev a counterargument would be, if it takes over 7 seconds you should optimise that loading time instead of forcing users to wait 7 seconds by using <img> lol
Philippine Crocodile
I mostly agree, but there are definitely a few niche usecases to allow for insane wait times -- situations for a high res image usually. Eg a dnd map or something that you can zoom into.