How can I improve the loading speed of my Impulse image banner?

Sascha22
Excursionist
40 0 13

Hi there,

 

using Impulse the first Image is loading sometimes, sometimes 10 sec.

 

Used tiny jpg, the image is only 172 kB small, for mobile nearly same.

 

Problem is, on the frontpage you can not use Image hero (no option for this) what maybe would increase speed, you can only choose slide, and we are using only one slide.

 

What can we do to improve loading this title image?
https://treeletic.de

 

Kind regards

Replies 14 (14)

Niel_natio
Shopify Partner
7 0 0
  • Resize and compress images. If you want to speed up your images, you should always optimize your photos by resizing and compressing them.
  • Set image dimensions.
  • Serve images optimized for each device.
  • Lazy load your images.
  • Convert your images to WebP.
  • Use a caching plugin.

Try out my steps then you're good to go

banned

Niel_natio
Shopify Partner
7 0 0

Or maybe it's just your store that's slow

banned

PedroCintra
Visitor
1 0 0

Hello Sascha, Im having the same issue, I saw Your website and it seems to be loading pretty fast, what did you do to fix it?

Sascha22
Excursionist
40 0 13

Hello PedroCintra, we needed to code and now everything is fine. What's your website, maybe we can have a look and give you advice.

ethnicasia
Visitor
1 0 0

my website ethnicasia.com

same issue

speedboostr
Trailblazer
136 20 26

I've run your store through our Analyzer  (https://analyze.speedboostr.com/result/gd3p9gf7d6) and good news - you have an A grade across all the tests! The hero image is already optimized with progressive jpeg encoding, so can only be degraded in quality to around 70 or 65% to further reduce the filesize and improve loading, or alternatively we can speed up the delivery of this image via upgrading your asset routing.

 

Beyond that a mobile only version could be loaded instead via modification to your theme's liquid code and CSS Stylesheet.

 

 

 

 Screen Shot 2565-08-31 at 12.33.30.png

 

From looking at the Analyzer's tests the only thing that is lacking currently is the lazy loading on 3 small icon images that are below the page fold (https://analyze.speedboostr.com/result/gd3p9gf7d6/rule/lazyLoadableImagesBelowTheFold)

 

Screen Shot 2565-08-31 at 12.38.20.png


We can take care of these modifications for you as part of our Entrepreneur package. Contact us for more information and to discuss the project with our team.

 

 

Creator of Theme Scientist (A/B testing app and theme scheduler). Creator of Shopify Analyzer (1st performance analysis tool for Shopify, free for the community). Founder of Speed Boostr (Shopify optimization experts + app developers). More apps from our team: Tip Jar (add a tip button), File Optimizer (optimize CSS, JS, Liquid).

Fabbrows
Tourist
6 0 1

Did you get this fixed? We're also having the same issue!!

www.fabbrows.us

BarumbaPlay
Tourist
8 0 0

same theme, same issue.

Jacksonvq
Shopify Partner
2 0 1

Hello @Sascha22 there is a simple solution.

 

Step1 : Go to Online store -> Themes -> Edit Code and search for "Slideshow.liquid" file and edit.

Step2 : now search for "loading loading--delayed" and replace that with "loaded" class.

 

Thats it now the images will load faster and will not wait for page to fully load.

BarumbaPlay
Tourist
8 0 0

Thank you so much. You have no idea how many hours I have spent trying to fix this. 

Hellofaheaven
Visitor
1 0 0

HI Jack, I'm trying to understand, do I replace the "loaded--delayed" to "loaded--class"?

thanks in advance!

 

- Greg

wille74
Visitor
1 0 0

No, replace "loading loading--delayed" to "loaded"

That's it!

Lila30
Visitor
2 0 0

I wanted to thank you so much because I've been racking my brain for weeks trying to find a solution to this incessant loading, thank you so much! I'd like to take this opportunity to ask you please how to get a moving image at the right size? I've already looked into it and was advised 800x800 but it's too small for the impulse theme :(((

Lila30
Visitor
2 0 0

Here's an example of my home page, the images don't go all the way to the sides:IMG_1897 2.jpg