Slow Loading Speed

Solved
chong
Excursionist
33 1 3

Hi, I currently have a store that is using an embed link from youtube to show the product in action. However, after adding the embed link in the product description, the product page loading speed increased by about 3.5 seconds.

I've added some html attribute code to lazyload the video and it helps slightly.

However, I was wondering whether using a gif as a product image instead of an embed link from youtube in the product description will be comparably faster?

I would really appreciate your help guys. Thank you in advance

p.s. I know Html, Css and some Javascript. Any advice be it code related or non code related will greatly help. Thanks!

0 Likes
JohnCodes
Shopify Partner
134 10 70

This is an accepted solution.

Hi @chong 

Nice attempt on trying to lazy load the YouTube video to improve performance. That's something I was going to recommend.

It's going to be kind of hard to tell whether or not a GIF will perform better than the YouTube video. That'll be dependent on the file size of the GIF. In some cases, the GIF may even make performance worse. I would just create the GIF and test it out.

Unfortunately, GIFs and videos will just about always add a noticeable negative impact to performance, which is why we recommend trying to stick with static images if possible.

However, it may be worth doing some A/B testing to see if showing your product in action increases sales. If so, it may be worth the performance trade-off.

Another route you could potentially take is to include your video and then try to optimize other areas of your site to make up for that increase in loading speed. You can run your website through the Shopify Analyzer (a free tool we built for the Shopify community) to see if there are any optimization opportunities.

I hope this helps! 

Developer at SpeedBoostr (Shopify optimization and dev agency).
Try out our Shopify Analyzer (free performance analysis tool).
Check out Order Automator (app that auto tags + fulfills orders, and more automation)
More Apps: Theme Scientist (A/B testing tool), Tip Jar (add a tip button to your store), File Optimizer (optimize CSS, JS, Liquid)
Zulfeqar
New Member
2 0 0

Please can you suggest some good app for our shopify website to increase product page speed to fulfil google core web vital requirments on mobile device.

0 Likes
Bdelucca
Excursionist
15 1 2

Hello Chong,

Gifs are usually bigger than videos from YouTube. What I would recommend for is to use a placeholder image and replace it later for the video. This will reduce the initial size of your page and later the video can be loaded by an event from the client or you can set a timer. Whatever works better for you.

Regards!

0 Likes