Sitecore Image Optimization

Optimize Images

Time and time again you see yourself solving an issue or providing a solution to a problem that seem to exist regardless of breadth of solution.  One such problem I noted on my clients is Images, no matter how advanced the actual sitecore implementation is, for some reason Images and their handling are not taken seriously enough.

On the projects where I am leading the technical effort, I almost always ensure and push the team to think about this because when we launch the site, it is sure very important to get the functionality right, but, what is also important is to ensure tools like Google page speeds and others out there give your effort a good ranking.  You might say, well it is just a number, but, it is important to understand the number is mere representation how fast and efficient your solution is and hence the numbers and issues are important.  At the end of the day, you want to see your website where you put in so much effort and money lands well on Google. 🙂

I am a true believer that we should never be re-inventing the wheel and always see where we can get with couple of smart solutions out there that folks use for this very purpose.  I toyed around with couple of options and compared them on different aspects, so, we can make a decision on next steps to get us where we would like to be.

Below are my findings on this comparison.

Note:  I am not supportive of either of these options I researched and only providing my thoughts around it.  Not meaning to offend any one or praise any one either.  🙂

Please leave a comment if you have any more thoughts or options that could prove to be useful.

Tools investigated are:

Dianoga – https://github.com/kamsar/Dianoga/blob/master/README.md

Image Crunch – https://github.com/1508/SitecoreExtension.ImageCrunch

Comparision Sheet between the favorites

DianogaKraken Based API calls
Installation and Set upWorks OOTB, no need to tailor or modify unless very specific needs arise
If CDN is in play, additional configuration might be needed. See some more steps noted for CDN set up here:
https://github.com/kamsar/Dianoga
We will need to test with CDN in play to ensure it still works with this additional steps
• Would need some honing as module does not seem to be perfect and need some issues to be addressed. See Git hub notes by me to the author –
https://github.com/vishalniit/InSitecore.Sitecore.ImageCrunch/issues/1
• API keys based on subscription for Kraken
Custom CodeNot needed for optimization specificallyWill be needed more than likely to ensure we tailor the solution to our needs. Can take reference from the module suggested and make it our own.
SubscriptionFreeMonthly subscription needed
https://kraken.io/pricing
Google Page SpeedStill few images not compressed to what Google expects it to be at.
But, I came to know that Dianoga works it's best with scaling parameters, so check that out if your implementation does not have scaling in place.
Compression respected by Google algorithm
Served FromMedia Cache
Image should be available on media cache which is based on request to the resource, so, optimization is on-demand
Media Library
Hook is on media library, so, every time a new image is uploaded or attached Kraken is called to Optimize the same if needed.
For existing images, there are few calls we can make right from content author ribbon.
Publish would be needed to ensure optimized images are being served upon request
Cache should be cleared if not already in play on CDN to ensure newly optimized images will be served

That is it you guys, hopefully this helps some one looking for a solution to optimize their Sitecore imagery.  Both of these options are unique in terms of how they deal with the problem on hand.  Ultimately, both seem to be good, so, picking an option would be mainly based on business and development teams preference based on their implementation.