We are creating a website with a basic gallery structure that gathers thumbnail images and makes the image appear larger when you click on the thumbnail.
Currently, thumbnails are imported from the same path as the original image, but only the image size has been reduced.
But as the images grow one by one, it's a waste to bring up tens or hundreds of original images, and I'd like to ask you how it's a smartly.
Is there a way to reduce the capacity as well as reduce the size when recalling thumbnails through the original image?
Or is it good to create a separate place where thumbnail files are collected, not through the original image? Or is there any other way?
One more question is whether it is better to enter the image path in inline style using background-image : url in the div element or separately on the style sheet.
If it is good to bring it to the division element with an img tag, I wonder why...!! Please help me.
html javascript jquery image-processing
Of course, it's easy to implement it by reducing the size, but it's not a good way.
More so if it's a data-sensitive mobile environment.
Of course, you can reduce the image size for thumbnails. This is where server-side programming is required.
I can think of two ways to use the thumbnail service.
The first is to create and return the thumbnail of the image on the server side, and the second is to create and return the thumbnail of the image in advance.
Both methods have advantages and disadvantages,
Creating a thumbnail using the per request method increases the load on the server and makes it difficult to meet a large number of requests because the same operation is repeated at the same time. Instead, there is no need to manage thumbnails separately.
If you create and service thumbnails for images in advance, you can reduce the service load and service them relatively lightly, but instead, whenever an image is changed or a new image is added, you need to create thumbnails and manage the generated thumbnails.
© 2024 OneMinuteCode. All rights reserved.