Best way to fetch images from external server?
Answered
Yellowstripe scad posted this in #help-forum
Yellowstripe scadOP
What is the best way to fetch images from frontend to the server (not Next's server)? Do I need to create a server endpoint e.g.
For example, I have a web which fetches 10 images in one page. Do I need to create a request for each image?
/images/<IMAGE-UUID> would that be a waste of resource?For example, I have a web which fetches 10 images in one page. Do I need to create a request for each image?
Answered by Anay-208 | Ping in replies
It obviously will, but it doesn’t make much of a difference, just use Promise.all to fetch all at once.
Let’s say if you fetch 10 images with an interval of 1s each image, that’ll decrease the load and will take 10s, but what if there are multiple users? It’ll take 10s for all users.
If you fetch 10 at once, 10 requests aren’t that much, and you can fetch all at once
Let’s say if you fetch 10 images with an interval of 1s each image, that’ll decrease the load and will take 10s, but what if there are multiple users? It’ll take 10s for all users.
If you fetch 10 at once, 10 requests aren’t that much, and you can fetch all at once
12 Replies
@Yellowstripe scad What is the best way to fetch images from frontend to the server (not Next's server)? Do I need to create a server endpoint e.g. `/images/<IMAGE-UUID>` would that be a waste of resource?
For example, I have a web which fetches 10 images in one page. Do I need to create a request for each image?
Umm do you want to display the image? Then use next/image
I’m just a little confused what you’re planning to do
I’m just a little confused what you’re planning to do
@Anay-208 | Ping in replies Umm do you want to display the image? Then use next/image
I’m just a little confused what you’re planning to do
Yellowstripe scadOP
I'm trying to build the server's infrastructure. How to effectively fetch images so that it doesn't spam the server with tens of requests.
@Yellowstripe scad I'm trying to build the server's infrastructure. How to effectively fetch images so that it doesn't spam the server with tens of requests.
What are you trying to do with image, like display it, or process it ?
@Anay-208 | Ping in replies What are you trying to do with image, like display it, or process it ?
Yellowstripe scadOP
The simplest example:
I have 2 frontend routes,
In the
In the
The
I have 2 frontend routes,
/post and /display. In the
/post route, user can post images and the server will store a randomly generated file UUID in the database containing and the file will be stored in a file system. In the
/display route, user can see the images that they have posted.The
/post route was easy to implement since it only needed 1 single API call . But what about the /display one, I need to fetch several images directly which means I need to create multiple API calls as well. This will surely increase the server load right?@Yellowstripe scad The simplest example:
I have 2 frontend routes, `/post` and `/display`.
In the `/post` route, user can post images and the server will store a randomly generated file UUID in the database containing and the file will be stored in a file system.
In the `/display` route, user can see the images that they have posted.
The `/post` route was easy to implement since it only needed 1 single API call . But what about the `/display` one, I need to fetch several images directly which means I need to create multiple API calls as well. This will surely increase the server load right?
It obviously will, but it doesn’t make much of a difference, just use Promise.all to fetch all at once.
Let’s say if you fetch 10 images with an interval of 1s each image, that’ll decrease the load and will take 10s, but what if there are multiple users? It’ll take 10s for all users.
If you fetch 10 at once, 10 requests aren’t that much, and you can fetch all at once
Let’s say if you fetch 10 images with an interval of 1s each image, that’ll decrease the load and will take 10s, but what if there are multiple users? It’ll take 10s for all users.
If you fetch 10 at once, 10 requests aren’t that much, and you can fetch all at once
Answer
@Anay-208 | Ping in replies It obviously will, but it doesn’t make much of a difference, just use Promise.all to fetch all at once.
Let’s say if you fetch 10 images with an interval of 1s each image, that’ll decrease the load and will take 10s, but what if there are multiple users? It’ll take 10s for all users.
If you fetch 10 at once, 10 requests aren’t that much, and you can fetch all at once
Yellowstripe scadOP
you can fetch all at oncehow? While the server can accept multiple files through forms, the server can only respond with 1 file. The workaround is to zip the files together
@Yellowstripe scad > you can fetch all at once
how? While the server can accept multiple files through forms, the server can only respond with 1 file. The workaround is to zip the files together
By fetch all at once, I mean send all requests at once
Yellowstripe scadOP
Is there no other way? I want to keep the requests as low as possible
@Yellowstripe scad Is there no other way? I want to keep the requests as low as possible
Fetch asynchrously, once at a time, but I wouldn't recommend that.
it won't make much difference in large scale, except make the app slow for the user
it won't make much difference in large scale, except make the app slow for the user
@Yellowstripe scad any other questions?
If not, can you mark solutions?
Yellowstripe scadOP
how