'Reducing Babylon CDN load size to increase site loading side speed

I am using Babylon CDN for my 360 images on my Shopify site. When I get the GTMatrix site speed report, Babylon CDN has HIGH flag that is showing slows the website load speed. How can I reduce Babylon CDN load size to increase site speed? Alternatively, how can I prevent it load and I want to render it when I click the button? Thanks



Solution 1:[1]

The technique you're describing is called lazy loading. Here's a shopify blog describing it.

You may be able to achieve this by using the async script tag.

<script src="https://cdn.babylonjs.com/babylon.js" async></script>

Solution 2:[2]

There are couple of improvements that can be done to increase images load speed

  1. Compress images (https://tinypng.com/)
  2. Use correct size resolution
  3. Convert images to modern webp format to reduce file size
  4. Use images lazy load (https://github.com/aFarkas/lazysizes)

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 chantey
Solution 2 Vitaliy Dankiv