CODEWITHSUNDEEP
c#asp.netimage-processing
Craig
Craig

Reputation: 18724

Thumbnails and a photo album

I am building a photo album for my photograph portfolio. But I am questioning myself on the following:

Should I save the thumbnail version on the file system on the server, or should I generate the thumbnail dynamically when the thumbnail image is requested?

I guess the pros for storing the thumbnail, is less processing on the server, as it generated the file once (when the file is uploaded). But the cons would be that if I decide one day that the thumbnails are the wrong size, I have an issue. Also, I store 2 files now (Thumb plus original).

Then, is there an optimal size for thumbnails? I guess the answer is - how big do you want the thumbnails stored. My problem is, my thumnails are being resized to a max of 150 high or max of 150 wide. However, the files still get to around 40k in size.

I am using this:

public void ResizeImage(string originalFile, string newFile, int newWidth, int maxHeight, bool onlyResizeIfWider)
    {
        System.Drawing.Image fullsizeImage = System.Drawing.Image.FromFile(MapPath(GlobalVariables.UploadPath + "/" + originalFile));

        // Prevent using images internal thumbnail
        fullsizeImage.RotateFlip(System.Drawing.RotateFlipType.Rotate180FlipNone);
        fullsizeImage.RotateFlip(System.Drawing.RotateFlipType.Rotate180FlipNone);

        if (onlyResizeIfWider)
        {
            if (fullsizeImage.Width <= newWidth)
            {
                newWidth = fullsizeImage.Width;
            }
        }

        int newHeight = fullsizeImage.Height * newWidth / fullsizeImage.Width;
        if (newHeight > maxHeight)
        {
            // Resize with height instead
            newWidth = fullsizeImage.Width * maxHeight / fullsizeImage.Height;
            newHeight = maxHeight;
        }

        System.Drawing.Image newImage = fullsizeImage.GetThumbnailImage(newWidth, newHeight, null, IntPtr.Zero);

        // Clear handle to original file so that we can overwrite it if necessary
        fullsizeImage.Dispose();
        // Save resized picture
        newImage.Save(MapPath(GlobalVariables.UploadPath + "/" + newFile));
    }

Is there a way to reduce the file size, as 150 high/150 wide is pretty small. I'd like to go up to around 250, but if I am showing 12 thumbs ... it takes a while to load.

Upvotes: 1

Views: 522

Answers (1)

Aristos
Aristos

Reputation: 66641

Yes absolutely must save as thumbnail file and not processing all the time.

About the image, try to make it to absolute fit on a 8x8 or 16x16 blocks of array because this is the size that jpeg use to split it and compress it. For example not make it 150x150 because 150/8= 18.75, use 152x152 because 152/8=19

Then the properties that reduce the file size and change the quality are

g.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.HighQualityBicubic;
g.PixelOffsetMode = System.Drawing.Drawing2D.PixelOffsetMode.HighQuality;
g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighQuality;

and here is an example of How to: Use Interpolation Mode to Control Image Quality During Scaling

Upvotes: 2

Related Questions