1

couple days ago I have made a "photo gallery" for me and my friends with a simple login system. Everything works, uploading photos, removing them using a root account, downloading photos etc.

But the problem appeared when we uploaded some photos from a camera where one photo have 10MB. After 30 photos like that whole page is loading so long. Any idea how to display photos in lower resolution just in preview but still downloading this big size photo?

Rabus
  • 41
  • 4

2 Answers2

0

You can use ImageMagick or GD to shrink the image's size before displaying it.

documentation :

You have (at least) two ways to shrink the image :

  • create a thumbnail during the upload
  • create the thumbnail while the web page is displayed

For the sake of performances, you should use the first choice. That means :

  • using the form, you upload a huge image
  • during the recording process the raw image is stored "as-is" and a smaller one is created using GD or image magick (the thumbnail)

In your photo gallery : you always display thumbnails and you display the "big one" only if the user clicks on it (for example).

  • The thing that first came to my mind was creating a thumbnail as the second file but I want so bad to operate on just one file and change its weight during displaying. – Rabus May 04 '18 at 11:44
  • You can do that, you need to call a PHP script in the tag that shrinks the image instead of the original file. For instance, becomes , if we consider that thumbnail.php is in charge of the shrinking process – Alex Debril May 04 '18 at 11:47
0

The concept is to resize images to perfectly fit their container, convert them to JPG and reduce their quality. This alone can chop a huge chunk of the size of an image.

I have handled this in two ways in the past: 1. PHP's native function imagejpeg

I won't go into details in the proportional resizing (it would be a whole answer on it's own), but after you do it you could convert, adjust the quality and save it using the imagejpeg function.

doc on imagejpeg

It takes three arguments; an image resource, the name you want the file to have (with the path to save) and the quality.

imagejpeg($resized_image, 'img/name.jpg', 75);

2. Using a CDN (like Cloudinary)

You can upload the images to a Content Delivery Network like Cloudinary (not sponsored) and let them handle the convertion, storage and serving of your images. Their API is very easy to use. https://cloudinary.com/documentation/php_integration