Calculating dianoga's optimized image size?

Question

Is there a way to programmatically get the Sitecore media files' size which is being optimized by Dianoga?

We need to show the image size on the site.

MediaItem.Size property is getting us the original image size - which isn't matching the rendered image size which is coming through the Dianoga processor.

Any ideas?

Answer 1

Server-side, no - probably. Dianoga acts as a layer between the Sitecore Media Library and the caching mechanics.

You can get the byte size of the images client-side however. Which would allow you to render these in your page.

This example lists sizes for all images on your page. Adjust as necessary.

var imgElems = document.getElementsByTagName('img');
for ( var i=0, len = imgElems.length; i < len; i++ ) 
{
    var url = imgElems[i].src || imgElems[i].href;
    if (url && url.length > 0)
    {
        var iTime = performance.getEntriesByName(url)[0];
        console.log(iTime.transferSize); //or encodedBodySize, decodedBodySize
    }
}

Source: https://stackoverflow.com/a/45409613/81631