Why is the first image on my mobile site always slow to load?

Technical Q&A
,
1

Greetings,

i am currently optimizing our site for performance. On desktop it’s fine, not perfect but ok. On mobile on the other hand, its terrible. Images are compressed quite good, 150kb for full HD images etc.

On mobile, it’s always the first image that shows 10+s loading on pagespeed.web.dev

If i remove the title image, it’s the first product image thats rendering 10+ seconds. If i have a title image, the first product image is fine, but the title is rendering forever, really weird. So it seems to be always the first image.

Pagespeed report: https://pagespeed.web.dev/analysis/https-exceed-store/p3peax8kca?form_factor=mobile

If i deactivate all plugins with javascript, nothing changes. I thought maybe it’s gempage since they use some lazyload feature, but the title image on the mainpage has nothing to do with gempage, it’s within the prestige theme.

Maybe you got some answers, thank you very much!

2

Hello @Josh1122 i have checked your store’s google page speed report and chrome console errors. Try converting images to webp format and fix the 404 / missing files on theme.

error.png
error.png1366×622 343 KB

3

Hello @Josh1122 ,
As I can see your website is having very heavy load with Largest Content Paint and Total Blocking Time.

oscprofessional_0-1709125158548.png
oscprofessional_0-1709125158548.png955×666 91.3 KB

In order to Improve website speed we need to:

  • Remove unnecessary code on a high priority basis.
  • Compressed images or Defer off-screen images.
  • Web Pages need to be reduce in size.
  • Reduce JavaScript execution time
  • Minimize main-thread work
  • Beware of excessive liquid loops
  • Decrease thumbnail image size
  • Weigh the benefits of installing another app

By fixing these issues, your website speed score can definitely improve.