Image Loading Time
Answered
Rex posted this in #help-forum
RexOP
Hello,
I'm figuring out why the next image loads a few seconds(~4 seconds in this instance) on the first load.
This is the Image setting I'm using.
<Image
className="h-full object-contain"
sizes="(min-width: 1024px) 50vw, 100vw"
alt={images[imageIndex]?.altText as string}
src={images[imageIndex]?.src as string}
priority={true}
fill
/>
The image's size is 252 kb in webp format. The source is cdn.shopify. (https://cdn.shopify.com/s/files/1/0573/9908/3107/files/quiche_1.webp?v=1712036455&w=828&q=75)
Has anyone dealt with slow loading nextjs image?
Can I get help on how I can reduce the loading time?
I'm figuring out why the next image loads a few seconds(~4 seconds in this instance) on the first load.
This is the Image setting I'm using.
<Image
className="h-full object-contain"
sizes="(min-width: 1024px) 50vw, 100vw"
alt={images[imageIndex]?.altText as string}
src={images[imageIndex]?.src as string}
priority={true}
fill
/>
The image's size is 252 kb in webp format. The source is cdn.shopify. (https://cdn.shopify.com/s/files/1/0573/9908/3107/files/quiche_1.webp?v=1712036455&w=828&q=75)
Has anyone dealt with slow loading nextjs image?
Can I get help on how I can reduce the loading time?
10 Replies
Looks to be normal
opened the url on a new tab
took around 3s to get a response.
Answer
@Rex
RexOP
Hi @Arinji , thanks for looking. Is 3~4 seconds to load the image normal in general on the first load? I'm quite new to nextjs
RexOP
ok that's good to know. thanks!
No worries, mark a solution