Hello guys,

I couldn't find any panoramic images on http://gs-qa.codestream.com.sg/. Thus, I am using the panoramic images on https://www.gorillaspace.co/ in my explanation below. Let us consider this image: https://d1wqd1iegxz4b6.cloudfront.net/uploads%2fimage%2fimage%2f1224%2ffull_004_xCollision8_Bar_on_premise_for_after_work_drinks.png.

I have created a CloudFront distribution (dk7rgpqdb1nj1.cloudfront.net) on our end to optimize images from d1wqd1iegxz4b6.cloudfront.net. You can simply replace the domain on the panoramic image URLs from d1wqd1iegxz4b6 to dk7rgpqdb1nj1 to get the optimized images. For the image above, the optimized URL would be https://dk7rgpqdb1nj1.cloudfront.net/uploads%2fimage%2fimage%2f1224%2ffull_004_xCollision8_Bar_on_premise_for_after_work_drinks.png

We offer a few flags for cases like this where you might intentionally want a much higher quality image for some reason or the other. You can supply parameters to the optimized image URLs to have a control on the level of optimization.

Resizing - With panoramic images, the viewport dimensions are smaller than the original image dimensions. We offer flags that help you resize. If you do not want the image to be resized at all, you can supply resize=none. Example: https://dk7rgpqdb1nj1.cloudfront.net/uploads%2fpano%2fimage%2f1471%2fpano_001_xCollision8_L9Coworking_View_of_Hot_Desks-pano.jpg?resize=none If you would like to have even greater control on the resizing, you can specify the image dimensions in pixels in resize=wx,ly forrmat where x is the intended width and y the intended height. Example: https://dk7rgpqdb1nj1.cloudfront.net/uploads%2fpano%2fimage%2f1471%2fpano_001_xCollision8_L9Coworking_View_of_Hot_Desks-pano.jpg?resize=w30,l15
Optimisation: We offer three optimization modes if you are not happy with the default optimization results - aggressive, mild and none. The URL parameter format for this is opt=aggressive or opt=mild or opt=none. aggressive mode is for cases where you want to optimize the image as much as possible, mild is for cases where you want to optimize but want to be on the safe side and none is for no optimization. For example, https://dk7rgpqdb1nj1.cloudfront.net/uploads%2fpano%2fimage%2f1471%2fpano_001_xCollision8_L9Coworking_View_of_Hot_Desks-pano.jpg?opt=mild.
In your case, if the quality is way more important than the performance hit, I recommend using resize=none. This will not resize the image but the image will still be optimized and look good. You will still save a considerable number of bytes and get the associated performance gains.

I hope my explanation is clear :)

Thanks.

Warmest Regards,
Shubham.