question

osyris-3187 avatar image
0 Votes"
osyris-3187 asked Laiq-9088 answered

Best way to Compress images for thumbnails

I have used the code from this document :

https://docs.microsoft.com/en-us/dotnet/desktop/winforms/advanced/how-to-set-jpeg-compression-level?view=netframeworkdesktop-4.8

It does what it should be doing. It lowers the quality and the img size
But for some reason when I use that lower quality image as a Thubmail (200px by 300px)
even only using 70% quality in the EncoderParameter it looks terrible,
every line in the image looks very pixelated, but when I see the full size of the lower quality image
it looks fine i hardly see any difference from the original image,

So im questioning if scalling down the image quality is the best way to create a Thumbnail,
Im not very familiar with image resizing.
Maybe scalling down the pixale size is better ?

I have tried this code :

     Image Imgfile = Image.FromFile(Path);               
        
     var NewImage = new Bitmap(300,200);
            
      using var a = Graphics.FromImage(NewImage);
      a.DrawImage( Imgfile, 0, 0, 300, 200);


this does scalle down the height and width to 300 x 200 but the Image size increased by 10x
the original image was 270kb and it turned into 1.2mb.


dotnet-aspnet-core-generaldotnet-aspnet-generaldotnet-aspnet-core-webapidotnet-aspnet-webapi
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

surferonwww avatar image
0 Votes"
surferonwww answered

I understand that you can use the graphics functions available in the System.Drawing namespace which rely on the GDI+ of Windows OS.

If so, I suggest that you set the Graphics.InterpolationMode property to InterpolationMode.HighQualityBicubic. Shown blow is sample code:

 #pragma warning disable CA1416
     
 using System.Drawing;
 using System.Drawing.Drawing2D;
 using System.Drawing.Imaging;
     
 namespace MvcCore6App.Utils
 {
     public class ImageUtils
     {
         // Make thumb of the size newWidth x newHeight
         public static byte[] MakeThumb(byte[] fullsize, int newWidth, int newHeight)
         {
             using (MemoryStream ms1 = new MemoryStream(fullsize))
             using (Image iOriginal = Image.FromStream(ms1))
             {                                
                 double scaleW = (double)iOriginal.Width / (double)newWidth;
                 double scaleH = (double)iOriginal.Height / (double)newHeight;
     
                 // Rectangle for triming original image
                 Rectangle srcRect = new Rectangle();
     
                 if (scaleH == scaleW)  // width = height => no triming
                 {
                     srcRect.Width = iOriginal.Width;
                     srcRect.Height = iOriginal.Height;
                     srcRect.X = 0;
                     srcRect.Y = 0;
                 }
                 else if (scaleH > scaleW) // heigt > width => trim height
                 {
                     srcRect.Width = iOriginal.Width;
                     srcRect.Height = Convert.ToInt32((double)newHeight * scaleW);
                     srcRect.X = 0;
                     srcRect.Y = (iOriginal.Height - srcRect.Height) / 2;
                 }
                 else   // height < width => trin width
                 {
                     srcRect.Width = Convert.ToInt32((double)newWidth * scaleH);
                     srcRect.Height = iOriginal.Height;
                     srcRect.X = (iOriginal.Width - srcRect.Width) / 2;
                     srcRect.Y = 0;
                 }
     
                 using (Image iThumb = new Bitmap(newWidth, newHeight))
                 using (Graphics g = Graphics.FromImage(iThumb))
                 {
                     g.InterpolationMode = InterpolationMode.HighQualityBicubic;
                     Rectangle destRect = new Rectangle(0, 0, newWidth, newHeight);
                     g.DrawImage(iOriginal, destRect, srcRect, GraphicsUnit.Pixel);
     
                     using (MemoryStream ms2 = new MemoryStream())
                     {
                         iThumb.Save(ms2, ImageFormat.Jpeg);
                         return ms2.GetBuffer();
                     }
                 }
             }
         }
     }
 } 
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Laiq-9088 avatar image
0 Votes"
Laiq-9088 answered

Big image files slow down page load times and make your site appear "larger." You can avoid these issues by compressing your images with a website like Jpeg compress


5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.