Technology, Smartphones, Games


BlogEngine - Reduce the image sizes up to 75 percentage

blogenginelogo

We are using BlogEngine.NET as our bloging plat form, from the beginning of this website. It is a cool open source, well supported ASP.NET blog engine.

The images using on our blog posts were PNG mostly and with big size caused slow page loading. If you too facing the same problem and will not mind about loosing an unnoticeable quality decrease, you may try this trick, which will reduce the image sizes up to 75%.

Earlier I wrote an additional image handler which will create resizes thumbnail images, for the home page. BlogEngine is just writing the image as is on the Image Handler class. Just changed that code a bit to make it jpg always. that is what I did and got the effect.

Change BlogEngine\BlogEngine.Core\Web\HttpHandlers\ImageHandler.cs

Old code (line 86)

var index = fileName.LastIndexOf(".") + 1;

var extension = fileName.Substring(index).ToUpperInvariant();

context.Response.ContentType = string.Compare(extension, "JPG") == 0 ? "image/jpeg" : string.Format("image/{0}", extension);

context.Response.BinaryWrite(file.FileContents);

Changed to

Bitmap bmpPhoto = new Bitmap(context.Server.MapPath(string.Format("{0}/files/", BlogConfig.StorageLocation) + fileName));

context.Response.ContentType = "image/jpeg";

bmpPhoto.Save(context.Response.OutputStream, System.Drawing.Imaging.ImageFormat.Jpeg);

bmpPhoto.Dispose();

You will have to rebuild and upload the BlogEngine.Core dll again.

Here are the Images

Before (PNG)

After changing to jpg

Size is reduced from 326 KB to 34 KB. that it is just 10% of the original image.