Shopify Google Page Speed

[Guifonte]

Hi guys!

I’d like to kindly ask for some help with my Google PageSpeed score. I’ve tried everything within my reach to improve the mobile performance. As you can see, it’s close to 70 which is not good. I’m struggling to understand where I still need to improve.

Could anyone give me a hand? I’d love to reach at least 95 in the ranking.

Thank you so much in advance, below is the  SS.

[Promer]

Hi @Guifonte 

I think getting a 95+ PageSpeed score on mobile for Shopify can be tough, but here are a few key areas to focus on:

• Make sure images are WebP format and use lazy loading to reduce initial load time.
• Check for leftover code from uninstalled apps using Chrome DevTools (Coverage Tab) and remove unnecessary scripts.
• Too many tracking pixels, live chats, or external widgets can slow things down. Try deferring them or using Google Tag Manager.
• Some themes are bloated; switching to a speed-optimized theme like Dawn or Debut can make a difference.

[Dotsquares]

hi @Guifonte 

Improving your Google PageSpeed score, especially on mobile, can be tricky! Since you're already at 70, here are a few key areas to check that might help push you closer to 95:

• Optimize Images – Use next-gen formats like WebP and compress images further.
• Reduce Unused CSS & JavaScript – Tools like PurifyCSS or WP Rocket (if on WordPress) can help.
• Enable Lazy Loading – This ensures images and videos load only when needed.
• Minimize Third-Party Scripts – Too many tracking scripts (Google Analytics, Facebook Pixel, etc.) can slow things down.
• Use a CDN (Content Delivery Network) – Services like Cloudflare can speed up global delivery.
• Improve Server Response Time – Consider upgrading hosting or using caching solutions.
• Preload Key Resources – Prioritize loading critical assets first.

[CafeDelMar]

Hey, @Guifonte.

I ran another test for your website and it gave me only 65 for mobile. The main issue you have with it is the LCP.

Lighthouse picks the fourth image (paper bag) as the LCP. The problem is that it is lazyloaded and loads the fourth image in queue. You can preload that image, which would solve those two issues, but you'd need to keep track of it when it changes. This can be somewhat tedious if your theme doesn't support that automatically. Or you can tweak the layout so another image is picked as the LCP.

Another thing is that there's a fade-in effect on the image. Lighthouse picks up on that and counts it as non-loaded. This should either be turned off in your theme settings or you can overwrite that with additional CSS rules. It's the "opacity" of the "li" element.

This alone won't boost your score to 90, but it would still help, as this is a current bottleneck.

 

[Guifonte]

Hi, thank you for your tips. I got no idea on how I am going to change this or where to add/change the codes. 
Does it come from theme.liquid or another section?

thanks,

GUi.

[CafeDelMar]

Hi. Sorry for the late reply. The opacity code I mentioned is located in your base.css file. But the rest can be spread throughout the theme. I can't tell you the exact location, unfortunately.